function MainComponent() { const handleSignInAsClubMember = ()=>{ window.location.href = "/club-dashboard"; }; const handleSignInAsTalent = ()=>{ window.location.href = "/talent-dashboard"; }; const handleSignUp = ()=>{ window.location.href = "/signup"; }; const signInForm = /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7fafc] p-4", __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md mx-auto bg-white rounded-lg shadow-md p-8", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl sm:text-4xl font-bold font-roboto text-[#374151] text-center mb-4", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "Talantenoo"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-lg text-[#6b7280] text-center mb-8", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, "A mobile platform for football and handball talents to showcase skills and connect with clubs."), /*#__PURE__*/ React.createElement("form", { className: "space-y-6", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "username", className: "block mb-2 text-sm font-roboto text-[#374151]", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, "Username"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "username", name: "username", defaultValue: "1", className: "w-full px-4 py-2 bg-gray-50 border border-gray-300 rounded-md text-[#374151] text-sm focus:border-blue-500 focus:ring-1 focus:ring-blue-500 focus:outline-none", readOnly: true, __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "password", className: "block mb-2 text-sm font-roboto text-[#374151]", __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, "Password"), /*#__PURE__*/ React.createElement("input", { type: "password", id: "password", name: "password", defaultValue: "1", className: "w-full px-4 py-2 bg-gray-50 border border-gray-300 rounded-md text-[#374151] text-sm focus:border-blue-500 focus:ring-1 focus:ring-blue-500 focus:outline-none", readOnly: true, __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: handleSignInAsClubMember, className: "text-white bg-[#2563eb]", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, "Club Member Login"), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: handleSignInAsTalent, className: "text-white bg-[#10b981]", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, "Talent Login")), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: handleSignUp, className: "w-full text-white bg-[#71717a] mt-4", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, "Sign Up")), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-center font-roboto text-sm text-[#2563eb] hover:underline focus:outline-none", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, "Forgot password?"))); return /*#__PURE__*/ React.createElement(React.Fragment, null, signInForm, /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, ` button { transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out; } button:hover { transform: scale(1.05); } button:active { transform: scale(0.95); } `)); }