function MainComponent() { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen p-4 bg-[#f7f7f7] dark:bg-[#333333]", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-semibold text-[#036635] dark:text-[#AEDBCE] mb-8", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, "近くの喫茶店を検索"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-3xl mb-6", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "distance", className: "block mb-2 text-lg font-medium text-[#036635] dark:text-[#AEDBCE]", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, "検索範囲を選択:"), /*#__PURE__*/ React.createElement("select", { id: "distance", name: "distance", className: "block w-full p-3 border border-[#036635] rounded-md dark:border-[#AEDBCE] bg-white dark:bg-[#222222] text-[#036635] dark:text-[#AEDBCE]", __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "1", __source: { fileName: "", lineNumber: 8, columnNumber: 11 }, __self: this }, "1km以内"), /*#__PURE__*/ React.createElement("option", { value: "5", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, "5km以内"), /*#__PURE__*/ React.createElement("option", { value: "10", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, "10km以内"))), /*#__PURE__*/ React.createElement("div", { className: "relative w-full h-[400px] mb-6", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-0 left-0 w-full h-full bg-gray-300 dark:bg-gray-700", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl font-medium text-gray-900 dark:text-gray-200", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, "マップがここに表示されます"))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md p-4 border border-[#036635] rounded-lg bg-white dark:bg-[#222222]", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#036635] dark:text-[#AEDBCE] mb-4", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, "喫茶店の詳細"), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-gray-900 dark:text-gray-200 mb-2", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "住所: 未選択"), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-gray-900 dark:text-gray-200 mb-2", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, "電話: 未選択"), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-gray-900 dark:text-gray-200 mb-2", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "公式サイト: ", /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-blue-500 dark:text-blue-300", __source: { fileName: "", lineNumber: 23, columnNumber: 77 }, __self: this }, "未選択")), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-gray-900 dark:text-gray-200", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, "レビュー: 未選択")), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 26, columnNumber: 7 }, __self: this }, ` body { transition: background-color 0.3s ease; } `)); }