// Icon primitives — inline SVG, stroke-based line icons matching wiseops.team

function Icon(props) {
  const size = props.size || 18;
  const stroke = props.stroke == null ? 2 : props.stroke;
  const common = {
    width: size, height: size, viewBox: "0 0 24 24",
    fill: "none", stroke: "currentColor", strokeWidth: stroke,
    strokeLinecap: "round", strokeLinejoin: "round",
    className: props.className || ""
  };

  const name = props.name;
  let inner = null;

  switch (name) {
    case "arrow":
      inner = <g><line x1="5" y1="12" x2="19" y2="12" /><polyline points="12 5 19 12 12 19" /></g>; break;
    case "chev-right":
      inner = <polyline points="9 6 15 12 9 18" />; break;
    case "chev-up":
      inner = <polyline points="6 14 12 8 18 14" />; break;
    case "chev":
      inner = <polyline points="6 9 12 15 18 9" />; break;
    case "phone":
      inner = <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.8 19.8 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.8 12.8 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.8 12.8 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" />; break;
    case "mail":
      inner = <g><rect x="2" y="4" width="20" height="16" rx="2" /><polyline points="2 6 12 13 22 6" /></g>; break;
    case "pin":
      inner = <g><path d="M12 22s7-6.5 7-12a7 7 0 1 0-14 0c0 5.5 7 12 7 12z" /><circle cx="12" cy="10" r="2.5" /></g>; break;
    case "calendar":
      inner = <g><rect x="3" y="5" width="18" height="16" rx="2" /><line x1="3" y1="10" x2="21" y2="10" /><line x1="8" y1="3" x2="8" y2="7" /><line x1="16" y1="3" x2="16" y2="7" /></g>; break;
    case "close":
      inner = <g><line x1="6" y1="6" x2="18" y2="18" /><line x1="18" y1="6" x2="6" y2="18" /></g>; break;
    case "check":
      inner = <polyline points="5 12 10 17 19 8" />; break;
    case "chart":
      inner = <g><line x1="3" y1="20" x2="21" y2="20" /><rect x="5" y="10" width="3" height="8" /><rect x="11" y="6" width="3" height="12" /><rect x="17" y="13" width="3" height="5" /></g>; break;
    case "shield":
      inner = <path d="M12 2l8 4v6c0 5-3.5 9-8 10-4.5-1-8-5-8-10V6l8-4z" />; break;
    case "zap":
      inner = <polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2" />; break;
    case "gauge":
      inner = <g><path d="M3 12a9 9 0 0 1 18 0" /><path d="M12 12l4-3" /><circle cx="12" cy="12" r="1.2" fill="currentColor" stroke="none"/></g>; break;
    case "refresh":
      inner = <g><polyline points="21 4 21 10 15 10" /><polyline points="3 20 3 14 9 14" /><path d="M3 14a9 9 0 0 0 15.5 3" /><path d="M21 10a9 9 0 0 0-15.5-3" /></g>; break;
    case "spark":
      inner = <path d="M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8" />; break;
    case "dice":
      inner = <g><rect x="3" y="3" width="18" height="18" rx="3" /><circle cx="8" cy="8" r="1.2" fill="currentColor" stroke="none"/><circle cx="16" cy="8" r="1.2" fill="currentColor" stroke="none"/><circle cx="8" cy="16" r="1.2" fill="currentColor" stroke="none"/><circle cx="16" cy="16" r="1.2" fill="currentColor" stroke="none"/><circle cx="12" cy="12" r="1.2" fill="currentColor" stroke="none"/></g>; break;
    case "ball":
      inner = <g><circle cx="12" cy="12" r="9" /><path d="M3 12h18M12 3c3 3 3 15 0 18M12 3c-3 3-3 15 0 18" /></g>; break;
    case "game":
      inner = <g><rect x="2" y="7" width="20" height="12" rx="4" /><line x1="8" y1="13" x2="10" y2="13" /><line x1="9" y1="12" x2="9" y2="14" /><circle cx="15" cy="12" r="1" fill="currentColor" stroke="none"/><circle cx="17" cy="14" r="1" fill="currentColor" stroke="none"/></g>; break;
    case "card":
      inner = <g><rect x="2" y="5" width="20" height="14" rx="2" /><line x1="2" y1="10" x2="22" y2="10" /></g>; break;
    case "cog":
      inner = <g><circle cx="12" cy="12" r="3" /><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z" /></g>; break;
    case "globe":
      inner = <g><circle cx="12" cy="12" r="9"/><line x1="3" y1="12" x2="21" y2="12"/><path d="M12 3c3 3 3 15 0 18M12 3c-3 3-3 15 0 18"/></g>; break;
    case "social-fb":
      inner = <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" fill="currentColor" stroke="none"/>; break;
    case "social-tg":
      inner = <path d="M21 4L2 11l6 2 2 7 3-4 5 4 3-16z" fill="currentColor" stroke="none"/>; break;
    case "social-wa":
      inner = <path d="M20.5 3.5A10 10 0 0 0 3.5 16L2 22l6-1.5A10 10 0 1 0 20.5 3.5z" fill="currentColor" stroke="none"/>; break;
    case "social-in":
      inner = <g><path d="M4 9h3v11H4zM5.5 3a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z" fill="currentColor" stroke="none"/><path d="M10 9h3v1.5A3.5 3.5 0 0 1 16 9c2.5 0 4 1.7 4 4.5V20h-3v-6c0-1.5-.5-2.5-2-2.5s-2 1-2 2.5v6h-3z" fill="currentColor" stroke="none"/></g>; break;
    default:
      inner = null;
  }

  return <svg {...common}>{inner}</svg>;
}

function Waves(props) {
  const stroke = props.stroke || "#D9DFEB";
  const opacity = props.opacity == null ? 0.6 : props.opacity;
  const lines = [];
  for (let i = 0; i < 18; i++) {
    lines.push(
      <path key={i} d={"M -100 " + (200 + i*38) + " Q 400 " + (120 + i*38) + " 800 " + (240 + i*38) + " T 1700 " + (200 + i*38)} />
    );
  }
  return (
    <div className="waves" aria-hidden="true">
      <svg viewBox="0 0 1600 900" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg" style={{opacity: opacity}}>
        <g fill="none" stroke={stroke} strokeWidth="1">{lines}</g>
      </svg>
    </div>
  );
}

window.Icon = Icon;
window.Waves = Waves;
