// icons.jsx — シンプルなSVGアイコンセット
const Icon = ({ name, size = 20, stroke = 2, color = "currentColor", style }) => {
  const props = { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: stroke, strokeLinecap: "round", strokeLinejoin: "round", style };
  const paths = {
    phone: <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-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 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.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" />,
    mail: <><rect x="2" y="4" width="20" height="16" rx="2" /><polyline points="22,6 12,13 2,6" /></>,
    check: <polyline points="20,6 9,17 4,12" />,
    chevron: <polyline points="6,9 12,15 18,9" />,
    shield: <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />,
    home: <><path d="M3 9.5L12 2l9 7.5V21a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V9.5z" /><polyline points="9 22 9 12 15 12 15 22" /></>,
    search: <><circle cx="11" cy="11" r="7" /><line x1="21" y1="21" x2="16.65" y2="16.65" /></>,
    award: <><circle cx="12" cy="8" r="6" /><polyline points="8.21,13.89 7,22 12,19 17,22 15.79,13.88" /></>,
    clock: <><circle cx="12" cy="12" r="10" /><polyline points="12,6 12,12 16,14" /></>,
    map: <><polygon points="1,6 1,22 8,18 16,22 23,18 23,2 16,6 8,2" /><line x1="8" y1="2" x2="8" y2="18" /><line x1="16" y1="6" x2="16" y2="22" /></>,
    pin: <><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" /><circle cx="12" cy="10" r="3" /></>,
    yen: <><path d="M5 4l7 9 7-9" /><line x1="12" y1="13" x2="12" y2="20" /><line x1="7" y1="15" x2="17" y2="15" /><line x1="7" y1="18" x2="17" y2="18" /></>,
    star: <polygon points="12,2 15.09,8.26 22,9.27 17,14.14 18.18,21.02 12,17.77 5.82,21.02 7,14.14 2,9.27 8.91,8.26" />,
    arrow: <><line x1="5" y1="12" x2="19" y2="12" /><polyline points="12,5 19,12 12,19" /></>,
    calendar: <><rect x="3" y="4" width="18" height="18" rx="2" /><line x1="16" y1="2" x2="16" y2="6" /><line x1="8" y1="2" x2="8" y2="6" /><line x1="3" y1="10" x2="21" y2="10" /></>,
    eye: <><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" /><circle cx="12" cy="12" r="3" /></>,
    spray: <><path d="M9 4h6v4H9z" /><path d="M10 8v12a2 2 0 0 0 2 2h0a2 2 0 0 0 2-2V8" /><line x1="16" y1="6" x2="20" y2="6" /><line x1="16" y1="9" x2="22" y2="9" /></>,
    handshake: <><path d="M11 17l4-4" /><path d="M3 12l4 4 8-8 4 4-2 2-2-2-4 4 4 4" /></>,
    family: <><circle cx="9" cy="7" r="3" /><circle cx="17" cy="9" r="2" /><path d="M3 21v-2a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v2" /><path d="M15 21v-1a3 3 0 0 1 3-3h1a3 3 0 0 1 3 3v1" /></>,
    note: <><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" /><polyline points="14 2 14 8 20 8" /><line x1="9" y1="13" x2="15" y2="13" /><line x1="9" y1="17" x2="13" y2="17" /></>,
    info: <><circle cx="12" cy="12" r="10" /><line x1="12" y1="16" x2="12" y2="12" /><line x1="12" y1="8" x2="12.01" y2="8" /></>,
    bug: <><rect x="8" y="6" width="8" height="14" rx="4" /><path d="M19 7l-3 2" /><path d="M5 7l3 2" /><path d="M19 13h-3" /><path d="M5 13h3" /><path d="M19 19l-3-2" /><path d="M5 19l3-2" /><path d="M12 2v4" /></>,
    menu: <><line x1="3" y1="6" x2="21" y2="6" /><line x1="3" y1="12" x2="21" y2="12" /><line x1="3" y1="18" x2="21" y2="18" /></>,
  };
  return <svg {...props}>{paths[name] || null}</svg>;
};

// 会社ロゴ（画像）
const Logo = ({ size = 48, style }) => (
  <img src={(typeof window !== "undefined" && window.__resources && window.__resources.logoImg) || "assets/logo.png"} alt="名古屋シロアリ駆除センター" style={{ height: size, width: "auto", display: "block", ...style }} />
);

// シンプルなマーク版（小さい場所用）
const LogoMark = ({ size = 48 }) => (
  <svg width={size} height={size} viewBox="0 0 64 64" fill="none">
    <circle cx="32" cy="32" r="28" stroke="#d63838" strokeWidth="5" fill="white" />
    <line x1="13" y1="13" x2="51" y2="51" stroke="#d63838" strokeWidth="5" strokeLinecap="round" />
    <ellipse cx="28" cy="34" rx="10" ry="11" fill="#f5d99c" stroke="#2a2520" strokeWidth="1.5" />
    <ellipse cx="28" cy="22" rx="6" ry="5" fill="#f5d99c" stroke="#2a2520" strokeWidth="1.5" />
    <path d="M24 18 L21 13 M32 18 L35 13" stroke="#2a2520" strokeWidth="1.5" strokeLinecap="round" />
    <rect x="36" y="36" width="16" height="14" fill="#f0e0c0" stroke="#2a2520" strokeWidth="1.5" />
    <polygon points="34,36 44,28 54,36" fill="#d4a060" stroke="#2a2520" strokeWidth="1.5" />
    <rect x="42" y="42" width="4" height="8" fill="#2a2520" />
  </svg>
);

Object.assign(window, { Icon, Logo, LogoMark });
