// icons.jsx — SVG icon set for Get Call Home
// Stroke = currentColor, sized via prop (default 22)

const Ico = ({ name, size = 22, stroke = 1.6, fill = "none" }) => {
  const s = size;
  const sw = stroke;
  const common = { width: s, height: s, viewBox: "0 0 24 24", fill, stroke: "currentColor", strokeWidth: sw, strokeLinecap: "round", strokeLinejoin: "round" };
  switch (name) {
    case "keypad":
      return (
        <svg {...common}>
          {[6,12,18].map((y) => [6,12,18].map((x) => (
            <circle key={`${x}-${y}`} cx={x} cy={y} r={0.9} fill="currentColor" stroke="none" />
          )))}
        </svg>
      );
    case "contacts":
      return (
        <svg {...common}>
          <circle cx="12" cy="9" r="3.4" />
          <path d="M5 19c1.6-3.2 4.2-4.8 7-4.8s5.4 1.6 7 4.8" />
        </svg>
      );
    case "recents":
      return (
        <svg {...common}>
          <circle cx="12" cy="12" r="8.5" />
          <path d="M12 7.5V12l3 2" />
        </svg>
      );
    case "phone":
      return (
        <svg {...common}>
          <path d="M5.5 4.5c-.6 0-1 .4-1 1 0 7.7 6.3 14 14 14 .6 0 1-.4 1-1v-2.6c0-.4-.3-.8-.7-.9l-3.3-.7c-.4-.1-.8.1-1 .4l-1 1.4c-2.4-1.1-4.3-3-5.4-5.4l1.4-1c.3-.2.5-.6.4-1l-.7-3.3c-.1-.4-.5-.7-.9-.7H5.5z" />
        </svg>
      );
    case "phone-fill":
      return (
        <svg {...common} fill="currentColor" stroke="none">
          <path d="M5.5 4.5h2.6c.5 0 .9.3 1 .8l.7 3.3c.1.4-.1.8-.4 1l-1.4 1c1.1 2.4 3 4.3 5.4 5.4l1-1.4c.2-.3.6-.5 1-.4l3.3.7c.5.1.8.5.8 1V18.5c0 .6-.4 1-1 1-7.7 0-14-6.3-14-14 0-.6.4-1 1-1z" />
        </svg>
      );
    case "phone-incoming":
      return (
        <svg {...common}>
          <path d="M14 7l4-4M14 7h4M14 7V3" />
          <path d="M5.5 4.5h2.6c.5 0 .9.3 1 .8l.7 3.3c.1.4-.1.8-.4 1l-1.4 1c1.1 2.4 3 4.3 5.4 5.4l1-1.4c.2-.3.6-.5 1-.4l3.3.7c.5.1.8.5.8 1V18.5c0 .6-.4 1-1 1-7.7 0-14-6.3-14-14 0-.6.4-1 1-1z" />
        </svg>
      );
    case "phone-outgoing":
      return (
        <svg {...common}>
          <path d="M18 3l-4 4M18 3v4M18 3h-4" />
          <path d="M5.5 4.5h2.6c.5 0 .9.3 1 .8l.7 3.3c.1.4-.1.8-.4 1l-1.4 1c1.1 2.4 3 4.3 5.4 5.4l1-1.4c.2-.3.6-.5 1-.4l3.3.7c.5.1.8.5.8 1V18.5c0 .6-.4 1-1 1-7.7 0-14-6.3-14-14 0-.6.4-1 1-1z" />
        </svg>
      );
    case "phone-missed":
      return (
        <svg {...common}>
          <path d="M14 3l4 4M18 3l-4 4" />
          <path d="M5.5 4.5h2.6c.5 0 .9.3 1 .8l.7 3.3c.1.4-.1.8-.4 1l-1.4 1c1.1 2.4 3 4.3 5.4 5.4l1-1.4c.2-.3.6-.5 1-.4l3.3.7c.5.1.8.5.8 1V18.5c0 .6-.4 1-1 1-7.7 0-14-6.3-14-14 0-.6.4-1 1-1z" />
        </svg>
      );
    case "plus": return <svg {...common}><path d="M12 5v14M5 12h14" /></svg>;
    case "minus": return <svg {...common}><path d="M5 12h14" /></svg>;
    case "x": return <svg {...common}><path d="M6 6l12 12M18 6L6 18" /></svg>;
    case "chev-left": return <svg {...common}><path d="M14 6l-6 6 6 6" /></svg>;
    case "chev-right": return <svg {...common}><path d="M10 6l6 6-6 6" /></svg>;
    case "chev-down": return <svg {...common}><path d="M6 9l6 6 6-6" /></svg>;
    case "search":
      return <svg {...common}><circle cx="11" cy="11" r="6.5" /><path d="M16 16l4 4" /></svg>;
    case "backspace":
      return (
        <svg {...common}>
          <path d="M4 12l4-5h11a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H8l-4-5z" />
          <path d="M14 10l-4 4M10 10l4 4" strokeWidth="1.4" />
        </svg>
      );
    case "user-plus":
      return <svg {...common}><circle cx="10" cy="9" r="3.4" /><path d="M4 19c1.5-2.9 3.6-4.2 6-4.2s4.5 1.3 6 4.2" /><path d="M18 5v6M15 8h6" strokeWidth="1.4" /></svg>;
    case "clipboard":
      return <svg {...common}><rect x="6" y="4" width="12" height="17" rx="2.2" /><path d="M9 4.5A1.5 1.5 0 0 1 10.5 3h3A1.5 1.5 0 0 1 15 4.5V6H9V4.5z" /><path d="M9 11h6M9 15h4" strokeWidth="1.5" /></svg>;
    case "edit":
      return <svg {...common}><path d="M4 20h4l11-11-4-4L4 16v4z" /></svg>;
    case "gift":
      return <svg {...common}><path d="M4 11h16v9H4z" /><path d="M2 7h20v4H2z" /><path d="M12 7v13" /><path d="M12 7c-1.5-3-5-3-5-1s2 2 5 1zM12 7c1.5-3 5-3 5-1s-2 2-5 1z" /></svg>;
    case "shield":
      return <svg {...common}><path d="M12 3l8 3v6c0 5-3.5 8.2-8 9-4.5-.8-8-4-8-9V6l8-3z" /><path d="M9 12l2 2 4-4" /></svg>;
    case "globe":
      return <svg {...common}><circle cx="12" cy="12" r="8.5" /><path d="M3.5 12h17" /><ellipse cx="12" cy="12" rx="4" ry="8.5" /></svg>;
    case "heart":
      return <svg {...common}><path d="M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z" /></svg>;
    case "alert":
      return <svg {...common}><circle cx="12" cy="12" r="8.5" /><path d="M12 8v5M12 16v.5" /></svg>;
    case "lock":
      return <svg {...common}><rect x="5" y="10" width="14" height="10" rx="2.5" /><path d="M8 10V7a4 4 0 1 1 8 0v3" /></svg>;
    case "mic": return <svg {...common}><rect x="9" y="3" width="6" height="12" rx="3" /><path d="M5.5 11a6.5 6.5 0 0 0 13 0M12 17.5V21" /></svg>;
    case "mic-off": return <svg {...common}><path d="M3 3l18 18" /><path d="M9 6.5a3 3 0 0 1 6 0V12a3 3 0 0 1-.4 1.5" /><path d="M9 9v3a3 3 0 0 0 5.1 2.2" /><path d="M5.5 11a6.5 6.5 0 0 0 11 4.6M18.5 11A6.5 6.5 0 0 0 17 7" /><path d="M12 17.5V21" /></svg>;
    case "speaker": return <svg {...common}><path d="M11 5L6 9H3v6h3l5 4V5z" /><path d="M15 9a4 4 0 0 1 0 6" /><path d="M18 7a7 7 0 0 1 0 10" /></svg>;
    case "pause": return <svg {...common}><rect x="6" y="5" width="4" height="14" rx="1" /><rect x="14" y="5" width="4" height="14" rx="1" /></svg>;
    case "send": return <svg {...common}><path d="M4 12l16-8-6 16-3-7-7-1z" /></svg>;
    case "check": return <svg {...common}><path d="M5 12l5 5 9-10" /></svg>;
    case "info": return <svg {...common}><circle cx="12" cy="12" r="8.5" /><path d="M12 11v5M12 8v.5" /></svg>;
    case "queue": return <svg {...common}><circle cx="12" cy="12" r="8.5" /><path d="M8 12h8M12 8v8" strokeOpacity=".3" /><path d="M12 8v4l3 2" /></svg>;
    case "card": return <svg {...common}><rect x="3" y="6" width="18" height="13" rx="2" /><path d="M3 10h18" /><path d="M7 15h4" /></svg>;
    case "settings": return <svg {...common}><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 0 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 0 1 0-4h.1A1.7 1.7 0 0 0 4.6 9a1.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 0 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 0 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z" /></svg>;
    case "signal": return (<svg {...common}><rect x="2" y="15" width="3" height="4" rx=".5" fill="currentColor" stroke="none"/><rect x="7" y="12" width="3" height="7" rx=".5" fill="currentColor" stroke="none"/><rect x="12" y="9" width="3" height="10" rx=".5" fill="currentColor" stroke="none"/><rect x="17" y="6" width="3" height="13" rx=".5" fill="currentColor" stroke="none"/></svg>);
    case "wifi": return (<svg {...common}><path d="M5 11.5a10 10 0 0 1 14 0M8 14.5a6 6 0 0 1 8 0M11 17.5a2 2 0 0 1 2 0" /></svg>);
    case "battery": return (<svg {...common}><rect x="2" y="8" width="18" height="9" rx="2" /><rect x="4" y="10" width="13" height="5" fill="currentColor" stroke="none"/><path d="M21 11v3" /></svg>);
    case "moon": return <svg {...common}><path d="M20 14.5A8.5 8.5 0 1 1 9.5 4a7 7 0 0 0 10.5 10.5z" /></svg>;
    case "sparkle":
      return <svg {...common}><path d="M12 4v4M12 16v4M4 12h4M16 12h4M6.3 6.3l2.8 2.8M14.9 14.9l2.8 2.8M17.7 6.3l-2.8 2.8M9.1 14.9l-2.8 2.8" /></svg>;
    default: return null;
  }
};

window.Ico = Ico;