/* Inline SVG icons — clean medical/clinical line set
   Usage: <Icon name="user" size={20} />
*/

const ICONS = {
  // segments
  user: <><circle cx="12" cy="8" r="4" /><path d="M4 21a8 8 0 0 1 16 0" /></>,
  stethoscope: <><path d="M6 3v6a4 4 0 0 0 8 0V3" /><path d="M10 13v3a5 5 0 0 0 10 0v-2" /><circle cx="20" cy="11" r="2" /></>,
  hospital: <><path d="M3 21V8l9-5 9 5v13" /><path d="M9 21v-6h6v6" /><path d="M12 9v4" /><path d="M10 11h4" /></>,
  building: <><rect x="4" y="3" width="16" height="18" rx="1.5" /><path d="M9 8h.01M9 12h.01M9 16h.01M15 8h.01M15 12h.01M15 16h.01" /></>,
  // services
  beaker: <><path d="M9 3v6L4 19a2 2 0 0 0 1.7 3h12.6a2 2 0 0 0 1.7-3L15 9V3" /><path d="M9 3h6" /><path d="M7 14h10" /></>,
  microscope: <><path d="M6 18h12" /><path d="M9 15l3-9 3 1-3 9z" /><path d="M11 6l-1 3" /><path d="M14 6l5 2-2 5-5-2" /><circle cx="9" cy="20" r="1.5" /></>,
  dna: <><path d="M5 3c4 0 4 6 7 6s3-6 7-6" /><path d="M5 21c4 0 4-6 7-6s3 6 7 6" /><path d="M7 6h10M7 18h10M9 9h6M9 15h6" /></>,
  virus: <><circle cx="12" cy="12" r="5" /><path d="M12 2v3M12 19v3M2 12h3M19 12h3M5 5l2 2M17 17l2 2M5 19l2-2M17 7l2-2" /></>,
  tube: <><path d="M9 2h6v15a3 3 0 0 1-6 0z" /><path d="M9 8h6" /><path d="M9 14h6" /></>,
  shield: <><path d="M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z" /><path d="M9 12l2 2 4-4" /></>,
  pulse: <><path d="M3 12h4l2-6 4 12 2-6h6" /></>,
  scan: <><path d="M4 8V5a1 1 0 0 1 1-1h3" /><path d="M20 8V5a1 1 0 0 0-1-1h-3" /><path d="M4 16v3a1 1 0 0 0 1 1h3" /><path d="M20 16v3a1 1 0 0 1-1 1h-3" /><path d="M4 12h16" /></>,
  briefcase: <><rect x="3" y="7" width="18" height="13" rx="2" /><path d="M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" /><path d="M3 13h18" /></>,
  // utility
  arrow: <><path d="M5 12h14M13 5l7 7-7 7" /></>,
  arrowDown: <><path d="M12 5v14M5 12l7 7 7-7" /></>,
  plus: <><path d="M12 5v14M5 12h14" /></>,
  check: <><path d="M5 12l4 4 10-12" /></>,
  search: <><circle cx="11" cy="11" r="7" /><path d="M21 21l-4.3-4.3" /></>,
  close: <><path d="M6 6l12 12M18 6L6 18" /></>,
  filter: <><path d="M4 5h16M7 12h10M10 19h4" /></>,
  sort: <><path d="M7 4v16M3 8l4-4 4 4M17 20V4M13 16l4 4 4-4" /></>,
  whatsapp: <><path d="M20 12a8 8 0 1 1-15 4l-1 4 4-1a8 8 0 0 0 12-7z" /><path d="M9 9c0 4 2 6 6 6 1 0 1.5-1 1-2l-1-1c-1 0-1.5 1-2 1-1 0-2-1-2-2 0-.5 1-1 1-2l-1-1c-1-.5-2 0-2 1z" /></>,
  phone: <><path d="M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.3 1.7.6 2.5a2 2 0 0 1-.5 2L8 9.6a16 16 0 0 0 6 6l1.4-1.4a2 2 0 0 1 2-.5c.8.3 1.6.5 2.5.6A2 2 0 0 1 22 16.9z" /></>,
  mail: <><rect x="3" y="5" width="18" height="14" rx="2" /><path d="M3 7l9 7 9-7" /></>,
  pin: <><path d="M12 22s7-7 7-12a7 7 0 0 0-14 0c0 5 7 12 7 12z" /><circle cx="12" cy="10" r="2.5" /></>,
  clock: <><circle cx="12" cy="12" r="9" /><path d="M12 7v5l3 2" /></>,
  calendar: <><rect x="3" y="5" width="18" height="16" rx="2" /><path d="M3 9h18M8 3v4M16 3v4" /></>,
  home: <><path d="M3 12l9-8 9 8" /><path d="M5 10v10h14V10" /><path d="M10 20v-5h4v5" /></>,
  drop: <><path d="M12 3s7 7 7 12a7 7 0 0 1-14 0c0-5 7-12 7-12z" /></>,
  monitor: <><rect x="2" y="3" width="20" height="14" rx="2" /><path d="M8 21h8M12 17v4" /></>,
  clipboard: <><rect x="8" y="2" width="8" height="4" rx="1" /><path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" /><path d="M9 12h6M9 16h4" /></>,
  route: <><circle cx="6" cy="19" r="2" /><circle cx="18" cy="5" r="2" /><path d="M8 19h6a3 3 0 0 0 0-6H10a3 3 0 0 1 0-6h6" /></>,
  award: <><circle cx="12" cy="8" r="6" /><path d="M15.5 13.5 17 22l-5-3-5 3 1.5-8.5" /></>,
  receipt: <><path d="M4 2v20l2-1 2 1 2-1 2 1 2-1 2 1 2-1 2 1V2l-2 1-2-1-2 1-2-1-2 1-2-1-2 1Z" /><path d="M8 7h8M8 11h8M8 15h5" /></>,
  docCheck: <><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" /><path d="M14 2v6h6" /><path d="m9 15 2 2 4-4" /></>,
  chevron: <><path d="M6 9l6 6 6-6" /></>,
  // ops icons
  grid: <><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" /></>,
  layers: <><path d="M12 2l10 6-10 6L2 8z" /><path d="M2 12l10 6 10-6" /><path d="M2 16l10 6 10-6" /></>,
  trending: <><path d="M3 17l6-6 4 4 8-8" /><path d="M14 7h7v7" /></>,
  link: <><path d="M10 14a4 4 0 0 0 6 0l3-3a4 4 0 0 0-6-6l-1 1" /><path d="M14 10a4 4 0 0 0-6 0l-3 3a4 4 0 0 0 6 6l1-1" /></>,
  network: <><circle cx="5" cy="6" r="2.5" /><circle cx="19" cy="6" r="2.5" /><circle cx="12" cy="18" r="2.5" /><path d="M7 7l8 9M17 7l-3 8" /></>,
  // socials
  fb: <><path d="M14 9V7a2 2 0 0 1 2-2h2v-3h-3a5 5 0 0 0-5 5v2H7v3h3v9h4v-9h3l1-3z" /></>,
  ig: <><rect x="3" y="3" width="18" height="18" rx="5" /><circle cx="12" cy="12" r="4" /><circle cx="17.5" cy="6.5" r="1" fill="currentColor" /></>,
  li: <><rect x="3" y="3" width="18" height="18" rx="2" /><path d="M8 10v7M8 7v.01M12 17v-4a2 2 0 0 1 4 0v4M12 10v7" /></>,
  yt: <><rect x="2" y="6" width="20" height="12" rx="3" /><path d="M10 9l5 3-5 3z" fill="currentColor" /></>,
  // menu
  menu: <><path d="M3 6h18M3 12h18M3 18h18" /></>,
};

function Icon({ name, size = 22, stroke = 1.6, className = "", style = {} }) {
  const path = ICONS[name];
  if (!path) return null;
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width={size} height={size}
      viewBox="0 0 24 24"
      fill="none" stroke="currentColor" strokeWidth={stroke}
      strokeLinecap="round" strokeLinejoin="round"
      className={className} style={style}
      aria-hidden="true"
    >{path}</svg>
  );
}

// Decorative molecule swirl (SVG) — echoes the logo's microbial spiral
function MoleculeSwirl({ color = "rgba(255,255,255,.55)", className = "molecule" }) {
  // randomized-looking but deterministic positions
  const dots = [];
  let r = 30, t = 0;
  for (let i = 0; i < 80; i++) {
    t += 0.42;
    r += 1.6;
    const cx = 50 + r * Math.cos(t);
    const cy = 50 + r * Math.sin(t);
    const radius = 0.6 + Math.sin(i * 0.7) * 0.5 + (i % 9 === 0 ? 2 : 0.5);
    dots.push(<circle key={i} cx={cx} cy={cy} r={Math.max(0.4, radius)} fill={color} />);
  }
  return (
    <svg className={className} viewBox="0 0 100 100" preserveAspectRatio="xMidYMid slice">
      {dots}
    </svg>
  );
}

Object.assign(window, { Icon, MoleculeSwirl, ICONS });