// Inline SVG icons (Lucide-style outline). Original drawings, ~24px viewBox.

const Icon = ({ children, size = 24, stroke = 'currentColor', strokeWidth = 1.75, className = '', ...rest }) => (
  <svg
    xmlns="http://www.w3.org/2000/svg"
    width={size} height={size} viewBox="0 0 24 24"
    fill="none" stroke={stroke} strokeWidth={strokeWidth}
    strokeLinecap="round" strokeLinejoin="round"
    className={className} {...rest}
  >
    {children}
  </svg>
);

const InboxIcon       = (p) => <Icon {...p}><path d="M22 12h-6l-2 3h-4l-2-3H2"/><path d="M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11Z"/></Icon>;
const BotIcon         = (p) => <Icon {...p}><rect x="4" y="7" width="16" height="12" rx="3"/><path d="M9 13h.01M15 13h.01"/><path d="M12 7V3"/><circle cx="12" cy="3" r="1"/><path d="M8 19v2M16 19v2"/></Icon>;
const MegaphoneIcon   = (p) => <Icon {...p}><path d="m3 11 18-6v14L3 13Z"/><path d="M11 13v5a2 2 0 0 1-4 0v-3"/></Icon>;
const ChartIcon       = (p) => <Icon {...p}><path d="M3 3v18h18"/><path d="M7 15l3-3 3 3 5-6"/></Icon>;
const PlugIcon        = (p) => <Icon {...p}><path d="M9 2v6M15 2v6"/><path d="M7 8h10v4a5 5 0 0 1-10 0z"/><path d="M12 17v5"/></Icon>;
const ShieldIcon      = (p) => <Icon {...p}><path d="M12 2 4 5v7c0 5 3.5 8.5 8 10 4.5-1.5 8-5 8-10V5l-8-3Z"/><path d="m9 12 2 2 4-4"/></Icon>;
const KanbanIcon      = (p) => <Icon {...p}><rect x="3" y="3" width="6" height="14" rx="1.5"/><rect x="11" y="3" width="6" height="9" rx="1.5"/><rect x="19" y="3" width="2" height="6" rx="1"/></Icon>;
const UsersIcon       = (p) => <Icon {...p}><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></Icon>;
const CalendarIcon    = (p) => <Icon {...p}><rect x="3" y="4" width="18" height="18" rx="2"/><path d="M16 2v4M8 2v4M3 10h18"/></Icon>;
const TagIcon         = (p) => <Icon {...p}><path d="M20.59 13.41 12 22 2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82Z"/><circle cx="7" cy="7" r="1.5"/></Icon>;
const ChatIcon        = (p) => <Icon {...p}><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></Icon>;
const CakeIcon        = (p) => <Icon {...p}><path d="M20 21V11a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v10"/><path d="M2 21h20"/><path d="M7 9V6a2 2 0 1 1 4 0v3M13 9V6a2 2 0 1 1 4 0v3"/></Icon>;
const FlowIcon        = (p) => <Icon {...p}><rect x="3" y="3" width="6" height="4" rx="1"/><rect x="15" y="10" width="6" height="4" rx="1"/><rect x="3" y="17" width="6" height="4" rx="1"/><path d="M9 5h3a3 3 0 0 1 3 3v4"/><path d="M9 19h3a3 3 0 0 0 3-3v-4"/></Icon>;
const LinkIcon        = (p) => <Icon {...p}><path d="M10 13a5 5 0 0 0 7.07 0l3-3a5 5 0 1 0-7.07-7.07l-1.41 1.41"/><path d="M14 11a5 5 0 0 0-7.07 0l-3 3a5 5 0 0 0 7.07 7.07l1.41-1.41"/></Icon>;
const WebhookIcon     = (p) => <Icon {...p}><path d="M18 16.98h-5.99c-1.66 0-3.01-1.34-3.01-3s1.34-3 3-3"/><path d="m6 21 3-5"/><path d="M14 3.05A7 7 0 0 0 5 9.5c0 1.5.5 2.7 1 3.5"/><circle cx="6" cy="17" r="2"/><circle cx="18" cy="17" r="2"/><circle cx="12" cy="6" r="2"/></Icon>;
const ZapIcon         = (p) => <Icon {...p}><path d="M13 2 3 14h7l-1 8 10-12h-7l1-8z"/></Icon>;
const SparkleIcon     = (p) => <Icon {...p}><path d="M12 3v4M12 17v4M3 12h4M17 12h4M5.5 5.5l2.8 2.8M15.7 15.7l2.8 2.8M5.5 18.5l2.8-2.8M15.7 8.3l2.8-2.8"/></Icon>;
const ArrowRightIcon  = (p) => <Icon {...p}><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></Icon>;
const PlayIcon        = (p) => <Icon {...p}><path d="M6 4v16l14-8z" fill="currentColor" stroke="none"/></Icon>;
const CheckIcon       = (p) => <Icon {...p}><path d="M20 6 9 17l-5-5"/></Icon>;
const SearchIcon      = (p) => <Icon {...p}><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></Icon>;
const FilterIcon      = (p) => <Icon {...p}><path d="M3 5h18M6 12h12M10 19h4"/></Icon>;
const PaperclipIcon   = (p) => <Icon {...p}><path d="m21 11-9.5 9.5a5 5 0 0 1-7-7L14 4a3.5 3.5 0 0 1 5 5L9.5 18.5a2 2 0 0 1-3-3L15 7"/></Icon>;
const SmileIcon       = (p) => <Icon {...p}><circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><path d="M9 9h.01M15 9h.01"/></Icon>;
const SendIcon        = (p) => <Icon {...p}><path d="m22 2-7 20-4-9-9-4z"/><path d="M22 2 11 13"/></Icon>;
const PhoneIcon       = (p) => <Icon {...p}><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 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-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z"/></Icon>;
const MoreIcon        = (p) => <Icon {...p}><circle cx="5" cy="12" r="1.5" fill="currentColor"/><circle cx="12" cy="12" r="1.5" fill="currentColor"/><circle cx="19" cy="12" r="1.5" fill="currentColor"/></Icon>;
const ChevronDownIcon = (p) => <Icon {...p}><path d="m6 9 6 6 6-6"/></Icon>;
const MenuIcon        = (p) => <Icon {...p}><path d="M3 6h18M3 12h18M3 18h18"/></Icon>;
const XIcon           = (p) => <Icon {...p}><path d="M18 6 6 18M6 6l12 12"/></Icon>;
const ClockIcon       = (p) => <Icon {...p}><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/></Icon>;
const TrendingUp      = (p) => <Icon {...p}><path d="m22 7-8.5 8.5-5-5L2 17"/><path d="M16 7h6v6"/></Icon>;

// WhatsApp-style icon (generic chat bubble with phone glyph — original drawing)
const WhatsAppIcon = ({ size = 20, className = '', fill = 'currentColor' }) => (
  <svg width={size} height={size} viewBox="0 0 24 24" className={className} fill={fill} aria-hidden="true">
    <path d="M12 2a10 10 0 0 0-8.6 15.05L2 22l5.1-1.34A10 10 0 1 0 12 2Zm5.6 14.2c-.24.67-1.4 1.27-1.95 1.34-.5.07-1.13.1-1.83-.12-.42-.13-.96-.31-1.66-.61-2.92-1.26-4.83-4.2-4.97-4.4-.15-.2-1.18-1.57-1.18-3 0-1.42.74-2.13 1-2.42.26-.28.57-.36.76-.36h.55c.18 0 .42-.07.65.5.24.6.83 2.06.9 2.2.07.15.12.32.02.5-.1.2-.15.32-.3.5-.15.17-.32.39-.45.52-.15.15-.31.32-.13.62.18.3.78 1.28 1.67 2.07 1.15 1.02 2.12 1.34 2.42 1.5.3.15.48.12.66-.07.18-.2.76-.88.96-1.18.2-.3.4-.25.67-.15.27.1 1.7.8 2 .95.3.15.5.22.57.35.07.13.07.74-.17 1.4Z"/>
  </svg>
);

Object.assign(window, {
  Icon, InboxIcon, BotIcon, MegaphoneIcon, ChartIcon, PlugIcon, ShieldIcon,
  KanbanIcon, UsersIcon, CalendarIcon, TagIcon, ChatIcon, CakeIcon, FlowIcon,
  LinkIcon, WebhookIcon, ZapIcon, SparkleIcon, ArrowRightIcon, PlayIcon,
  CheckIcon, SearchIcon, FilterIcon, PaperclipIcon, SmileIcon, SendIcon,
  PhoneIcon, MoreIcon, ChevronDownIcon, MenuIcon, XIcon, ClockIcon, TrendingUp,
  WhatsAppIcon,
});
