// Stroke-style line icons (24px viewBox), rendered via currentColor.
// Friendly weight: 1.6px stroke, round caps, round joins.
const Ic = ({ d, size = 18, fill, stroke = "currentColor", sw = 1.6, children, ...rest }) => (
  <svg className={`ic${rest.className ? ' ' + rest.className : ''}`}
       viewBox="0 0 24 24" width={size} height={size}
       fill={fill || "none"} stroke={stroke}
       strokeWidth={sw} strokeLinecap="round" strokeLinejoin="round"
       aria-hidden="true">
    {d ? <path d={d} /> : children}
  </svg>
);

const Icons = {
  home:    (p) => <Ic {...p}><path d="M4 11l8-7 8 7"/><path d="M6 10v9a1 1 0 0 0 1 1h3v-6h4v6h3a1 1 0 0 0 1-1v-9"/></Ic>,
  book:    (p) => <Ic {...p}><path d="M5 4h9a4 4 0 0 1 4 4v12H9a4 4 0 0 1-4-4V4z"/><path d="M5 16a4 4 0 0 1 4-4h9"/></Ic>,
  users:   (p) => <Ic {...p}><circle cx="9" cy="8" r="3.5"/><path d="M3 19c.5-3.3 3-5 6-5s5.5 1.7 6 5"/><circle cx="17" cy="9" r="2.5"/><path d="M16 14c2.6.2 4.4 1.7 5 5"/></Ic>,
  video:   (p) => <Ic {...p}><rect x="3" y="6" width="13" height="12" rx="2"/><path d="M16 10l5-3v10l-5-3z"/></Ic>,
  quiz:    (p) => <Ic {...p}><path d="M9 9a3 3 0 1 1 4 2.8c-.6.3-1 .9-1 1.5V14"/><circle cx="12" cy="17.5" r=".8" fill="currentColor" stroke="none"/><circle cx="12" cy="12" r="9"/></Ic>,
  chat:    (p) => <Ic {...p}><path d="M4 5h16v11H10l-4 4v-4H4z"/></Ic>,
  cert:    (p) => <Ic {...p}><circle cx="12" cy="10" r="5"/><path d="M9 14l-2 7 5-2 5 2-2-7"/></Ic>,
  chart:   (p) => <Ic {...p}><path d="M4 20V8"/><path d="M10 20V4"/><path d="M16 20v-8"/><path d="M3 20h18"/></Ic>,
  store:   (p) => <Ic {...p}><path d="M3 8l1.5-3h15L21 8"/><path d="M3 8h18v3a3 3 0 0 1-6 0 3 3 0 0 1-6 0 3 3 0 0 1-6 0z"/><path d="M5 11v9h14v-9"/></Ic>,
  megaphone:(p) => <Ic {...p}><path d="M3 11v2a1 1 0 0 0 1 1h3l8 5V5L7 10H4a1 1 0 0 0-1 1z"/><path d="M19 9a4 4 0 0 1 0 6"/></Ic>,
  cog:     (p) => <Ic {...p}><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1.1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.5-1.1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z"/></Ic>,
  search:  (p) => <Ic {...p}><circle cx="11" cy="11" r="7"/><path d="M21 21l-4.3-4.3"/></Ic>,
  bell:    (p) => <Ic {...p}><path d="M6 16V11a6 6 0 1 1 12 0v5l1.5 2H4.5z"/><path d="M10 21a2 2 0 0 0 4 0"/></Ic>,
  plus:    (p) => <Ic {...p}><path d="M12 5v14M5 12h14"/></Ic>,
  chevron: (p) => <Ic {...p}><path d="M9 6l6 6-6 6"/></Ic>,
  check:   (p) => <Ic {...p}><path d="M5 12l5 5 9-11"/></Ic>,
  trend:   (p) => <Ic {...p}><path d="M3 17l6-6 4 4 8-9"/><path d="M14 6h7v7"/></Ic>,
  eye:     (p) => <Ic {...p}><path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12z"/><circle cx="12" cy="12" r="3"/></Ic>,
  filter:  (p) => <Ic {...p}><path d="M3 5h18l-7 9v6l-4-2v-4z"/></Ic>,
  sort:    (p) => <Ic {...p}><path d="M7 4v16M3 8l4-4 4 4"/><path d="M17 20V4M13 16l4 4 4-4"/></Ic>,
  more:    (p) => <Ic {...p}><circle cx="5" cy="12" r="1.4" fill="currentColor" stroke="none"/><circle cx="12" cy="12" r="1.4" fill="currentColor" stroke="none"/><circle cx="19" cy="12" r="1.4" fill="currentColor" stroke="none"/></Ic>,
  drag:    (p) => <Ic {...p}><circle cx="9" cy="6" r="1.2" fill="currentColor" stroke="none"/><circle cx="15" cy="6" r="1.2" fill="currentColor" stroke="none"/><circle cx="9" cy="12" r="1.2" fill="currentColor" stroke="none"/><circle cx="15" cy="12" r="1.2" fill="currentColor" stroke="none"/><circle cx="9" cy="18" r="1.2" fill="currentColor" stroke="none"/><circle cx="15" cy="18" r="1.2" fill="currentColor" stroke="none"/></Ic>,
  play:    (p) => <Ic {...p}><path d="M7 5v14l12-7z" fill="currentColor"/></Ic>,
  file:    (p) => <Ic {...p}><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z"/><path d="M14 3v5h5"/></Ic>,
  filetext:(p) => <Ic {...p}><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z"/><path d="M14 3v5h5"/><path d="M9 13h7M9 17h5"/></Ic>,
  pdf:     (p) => <Ic {...p}><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z"/><path d="M14 3v5h5"/><path d="M9 14h6M9 17h4"/></Ic>,
  audio:   (p) => <Ic {...p}><path d="M9 18V6l10-2v12"/><circle cx="6" cy="18" r="3"/><circle cx="16" cy="16" r="3"/></Ic>,
  link:    (p) => <Ic {...p}><path d="M10 14a4 4 0 0 0 5.7 0l3-3a4 4 0 1 0-5.7-5.7L11 7"/><path d="M14 10a4 4 0 0 0-5.7 0l-3 3a4 4 0 1 0 5.7 5.7L13 17"/></Ic>,
  mail:    (p) => <Ic {...p}><rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 7l9 7 9-7"/></Ic>,
  phone:   (p) => <Ic {...p}><path d="M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z"/></Ic>,
  star:    (p) => <Ic {...p}><path d="M12 3l2.6 5.6 6.1.6-4.6 4.2 1.3 6.1L12 16.8 6.6 19.5l1.3-6.1L3.3 9.2l6.1-.6z"/></Ic>,
  calendar:(p) => <Ic {...p}><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4"/></Ic>,
  clock:   (p) => <Ic {...p}><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></Ic>,
  upload:  (p) => <Ic {...p}><path d="M12 16V4M7 9l5-5 5 5"/><path d="M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"/></Ic>,
  edit:    (p) => <Ic {...p}><path d="M14 4l6 6L9 21H3v-6z"/></Ic>,
  trash:   (p) => <Ic {...p}><path d="M4 6h16M9 6V4h6v2M6 6l1 14a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-14"/></Ic>,
  copy:    (p) => <Ic {...p}><rect x="8" y="8" width="12" height="12" rx="2"/><path d="M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2"/></Ic>,
  globe:   (p) => <Ic {...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"/></Ic>,
  send:    (p) => <Ic {...p}><path d="M21 3L3 11l7 3 3 7z"/><path d="M21 3L10 14"/></Ic>,
  flame:   (p) => <Ic {...p}><path d="M12 3s4 4 4 8a4 4 0 0 1-8 0c0-2 1-3 1-3s-3 2-3 6a6 6 0 0 0 12 0c0-5-6-11-6-11z"/></Ic>,
  trophy:  (p) => <Ic {...p}><path d="M7 4h10v5a5 5 0 0 1-10 0z"/><path d="M5 6H3v2a3 3 0 0 0 3 3M19 6h2v2a3 3 0 0 1-3 3"/><path d="M9 14v3l-1 4h8l-1-4v-3"/></Ic>,
};

// shortcut wrapper
const Icon = ({ name, ...rest }) => {
  const C = Icons[name];
  return C ? <C {...rest} /> : null;
};

window.Icons = Icons;
window.Icon = Icon;