// app-icons.jsx — minimal geometric line icons for the Civify app
// Export: Icon ({ name, size, color, stroke, fill })
(function () {
  const P = {
    // course icons
    institution: (
      <g>
        <path d="M3 9l9-5 9 5" />
        <path d="M5 9v8M9 9v8M15 9v8M19 9v8" />
        <path d="M3 20h18" />
      </g>
    ),
    scale: (
      <g>
        <path d="M12 4v16M7 20h10" />
        <path d="M12 6l-7 2 3 5a3 3 0 01-6 0l3-5" />
        <path d="M12 6l7 2-3 5a3 3 0 006 0l-3-5" />
      </g>
    ),
    person: (
      <g>
        <circle cx="12" cy="8" r="3.4" />
        <path d="M5.5 20a6.5 6.5 0 0113 0" />
      </g>
    ),
    ballot: (
      <g>
        <rect x="4" y="9" width="16" height="11" rx="1.5" />
        <path d="M9 9V6.5a3 3 0 016 0V9" />
        <path d="M9.5 14.5l2 2 3-3.5" />
      </g>
    ),
    // ui / badges
    flame: (
      <g>
        <path d="M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.07-2.14-.22-4.05 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.15.43-2.29 1-3a2.5 2.5 0 0 0 2.5 2.5z" />
      </g>
    ),
    check: (
      <g>
        <path d="M5 12.5l4.5 4.5L19 7" />
      </g>
    ),
    star: (
      <g>
        <path d="M12 3.5l2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 17l-5.2 2.6 1-5.8-4.3-4.1 5.9-.9z" />
      </g>
    ),
    globe: (
      <g>
        <circle cx="12" cy="12" r="9" />
        <path d="M3 12h18M12 3c2.8 3 2.8 15 0 18M12 3c-2.8 3-2.8 15 0 18" />
      </g>
    ),
    home: (
      <g>
        <path d="M4 11l8-7 8 7" />
        <path d="M6 10v10h12V10" />
      </g>
    ),
    compass: (
      <g>
        <circle cx="12" cy="12" r="9" />
        <path d="M15.5 8.5l-2 5-5 2 2-5z" />
      </g>
    ),
    lock: (
      <g>
        <rect x="5" y="10" width="14" height="10" rx="2" />
        <path d="M8 10V7a4 4 0 018 0v3" />
      </g>
    ),
    bolt: (
      <g>
        <path d="M13 2L4 14h7l-1 8 9-12h-7z" />
      </g>
    ),
    arrowRight: (
      <g>
        <path d="M5 12h14M13 6l6 6-6 6" />
      </g>
    ),
    close: (
      <g>
        <path d="M6 6l12 12M18 6L6 18" />
      </g>
    ),
    trophy: (
      <g>
        <path d="M7 4h10v4a5 5 0 01-10 0z" />
        <path d="M7 5H4v2a3 3 0 003 3M17 5h3v2a3 3 0 01-3 3" />
        <path d="M12 13v3M9 20h6M10 20v-2h4v2" />
      </g>
    ),
    grid: (
      <g>
        <rect x="4" y="4" width="7" height="7" rx="1.5" />
        <rect x="13" y="4" width="7" height="7" rx="1.5" />
        <rect x="4" y="13" width="7" height="7" rx="1.5" />
        <rect x="13" y="13" width="7" height="7" rx="1.5" />
      </g>
    ),
    chart: (
      <g>
        <path d="M4 20V4M4 20h16" />
        <rect x="7" y="12" width="3" height="5" rx="1" />
        <rect x="12" y="9" width="3" height="8" rx="1" />
        <rect x="17" y="6" width="3" height="11" rx="1" />
      </g>
    ),
    layers: (
      <g>
        <path d="M12 3l9 5-9 5-9-5z" />
        <path d="M3 13l9 5 9-5" />
      </g>
    ),
    shield: (
      <g>
        <path d="M12 3l7 3v5c0 4.5-3 7.5-7 9-4-1.5-7-4.5-7-9V6z" />
        <path d="M9 12l2 2 4-4" />
      </g>
    ),
    mail: (
      <g>
        <rect x="3" y="5" width="18" height="14" rx="2.5" />
        <path d="M4 7l8 6 8-6" />
      </g>
    ),
    play: (
      <g>
        <path d="M7 4l13 8-13 8z" />
      </g>
    ),
  };

  function Icon({ name, size = 24, color = 'currentColor', stroke = 2, fill = 'none', style }) {
    return (
      <svg
        width={size}
        height={size}
        viewBox="0 0 24 24"
        fill={fill}
        stroke={color}
        strokeWidth={stroke}
        strokeLinecap="round"
        strokeLinejoin="round"
        style={style}
        aria-hidden="true"
      >
        {P[name] || null}
      </svg>
    );
  }

  window.Icon = Icon;
})();