// Nexa — shared icon set (line-style, 24x24 viewBox)
// Subtle, monochromatic, calm — never glowing or "AI".

const Icon = ({ name, size = 22, className = "icon", style }) => {
  const props = {
    width: size, height: size, viewBox: "0 0 24 24",
    fill: "none", stroke: "currentColor", strokeWidth: 1.4,
    strokeLinecap: "round", strokeLinejoin: "round",
    className, style
  };
  switch (name) {
    case "logo":
      // Maturity glyph — canonical Tenor mark. Tick · bar · terminus.
      // Coords match brand/dir-tenor.jsx exactly so this looks identical
      // to the brand exposition at every scale.
      return (
        <svg
          width={size} height={size} viewBox="0 0 48 48" fill="none"
          className={className} style={{ ...style, width: "28px", height: "28px" }}
          aria-hidden="true">
          
          <rect x="6" y="14" width="2.4" height="20" fill="currentColor" />
          <rect x="8.4" y="22.8" width="26" height="2.4" fill="currentColor" />
          <circle cx="38.5" cy="24" r="4.2" fill="currentColor" />
        </svg>);

    case "payroll":
      return (
        <svg {...props}>
          <rect x="3" y="6" width="18" height="13" rx="1.5" />
          <path d="M3 10h18" />
          <circle cx="12" cy="14.5" r="1.6" />
        </svg>);

    case "invoice":
      return (
        <svg {...props}>
          <path d="M6 3h9l3 3v15H6z" />
          <path d="M9 9h6M9 13h6M9 17h4" />
        </svg>);

    case "fx":
      return (
        <svg {...props}>
          <path d="M4 8h13l-3-3" />
          <path d="M20 16H7l3 3" />
        </svg>);

    case "treasury":
      return (
        <svg {...props}>
          <path d="M3 9l9-5 9 5" />
          <path d="M5 9v9M19 9v9M9 9v9M15 9v9" />
          <path d="M3 21h18" />
        </svg>);

    case "shield":
      return (
        <svg {...props}>
          <path d="M12 3l8 3v6c0 4.5-3.5 8-8 9-4.5-1-8-4.5-8-9V6l8-3z" />
          <path d="M9 12l2 2 4-4" />
        </svg>);

    case "lock":
      return (
        <svg {...props}>
          <rect x="5" y="11" width="14" height="9" rx="1.5" />
          <path d="M8 11V8a4 4 0 0 1 8 0v3" />
        </svg>);

    case "audit":
      return (
        <svg {...props}>
          <path d="M4 4h12l4 4v12H4z" />
          <path d="M16 4v4h4" />
          <path d="M8 13h8M8 17h5" />
        </svg>);

    case "arrow-right":
      return (
        <svg {...props}>
          <path d="M5 12h14M13 6l6 6-6 6" />
        </svg>);

    case "check":
      return (
        <svg {...props}>
          <path d="M5 12l4 4 10-10" />
        </svg>);

    case "card":
      return (
        <svg {...props}>
          <rect x="3" y="6" width="18" height="13" rx="1.5" />
          <path d="M3 10h18" />
          <path d="M6 15h3" />
        </svg>);

    case "copy":
      return (
        <svg {...props}>
          <rect x="8" y="8" width="12" height="12" rx="1.5" />
          <path d="M16 8V5a1 1 0 0 0-1-1H5a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h3" />
        </svg>);

    case "play":
      return (
        <svg {...props}>
          <path d="M7 5l12 7-12 7z" />
        </svg>);

    case "code":
      return (
        <svg {...props}>
          <path d="M8 8l-4 4 4 4M16 8l4 4-4 4" />
        </svg>);

    case "endpoint":
      return (
        <svg {...props}>
          <circle cx="6" cy="12" r="2" />
          <circle cx="18" cy="6" r="2" />
          <circle cx="18" cy="18" r="2" />
          <path d="M8 12l8-6M8 12l8 6" />
        </svg>);

    case "pulse":
      return (
        <svg {...props}>
          <path d="M3 12h4l2-6 4 12 2-6h6" />
        </svg>);

    case "policy":
      return (
        <svg {...props}>
          <rect x="4" y="3" width="16" height="18" rx="1.5" />
          <path d="M8 8h8M8 12h8M8 16h5" />
        </svg>);

    case "approve":
      return (
        <svg {...props}>
          <circle cx="12" cy="12" r="9" />
          <path d="M8 12l3 3 5-6" />
        </svg>);

    case "globe":
      return (
        <svg {...props}>
          <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" />
        </svg>);

    case "agent":
      return (
        <svg {...props}>
          <circle cx="12" cy="12" r="3" />
          <path d="M12 4v3M12 17v3M4 12h3M17 12h3M6.3 6.3l2.1 2.1M15.6 15.6l2.1 2.1M6.3 17.7l2.1-2.1M15.6 8.4l2.1-2.1" />
        </svg>);

    case "structure":
      return (
        <svg {...props}>
          <rect x="3" y="3" width="7" height="7" rx="1" />
          <rect x="14" y="3" width="7" height="7" rx="1" />
          <rect x="3" y="14" width="7" height="7" rx="1" />
          <rect x="14" y="14" width="7" height="7" rx="1" />
        </svg>);

    case "execute":
      return (
        <svg {...props}>
          <circle cx="12" cy="12" r="9" />
          <path d="M9 8l6 4-6 4z" fill="currentColor" stroke="none" />
        </svg>);

    case "data":
      return (
        <svg {...props}>
          <ellipse cx="12" cy="6" rx="8" ry="3" />
          <path d="M4 6v6c0 1.7 3.6 3 8 3s8-1.3 8-3V6" />
          <path d="M4 12v6c0 1.7 3.6 3 8 3s8-1.3 8-3v-6" />
        </svg>);

    default:return null;
  }
};

window.Icon = Icon;