function MainComponent() { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7f7f7] p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-[#121212] text-3xl mb-8", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, "Reconcile My Spreadsheet"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row md:items-end w-full max-w-4xl", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 mb-6 md:mb-0 md:mr-6", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "spreadsheet-file", className: "block text-lg font-roboto text-[#121212] mb-2", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, "Upload My Spreadsheet"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "spreadsheet-file", name: "mySpreadsheet", accept: ".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel", className: "block w-full text-sm text-[#121212] file:border-none file:rounded file:bg-[#e2e8f0] file:py-2 file:px-4", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "flex items-center justify-center px-4 py-2 bg-[#4f46e5] hover:bg-[#3c45c2] text-white font-roboto rounded", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, "Reconcile My Spreadsheet", /*#__PURE__*/ React.createElement("i", { className: "fas fa-sync-alt ml-2", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-4xl mt-12 overflow-hidden rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full overflow-x-auto", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "w-full whitespace-no-wrap", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { className: "text-left font-roboto text-[#121212] bg-[#e2e8f0]", __source: { fileName: "", lineNumber: 27, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("th", { className: "px-6 py-3", __source: { fileName: "", lineNumber: 28, columnNumber: 17 }, __self: this }, "Date"), /*#__PURE__*/ React.createElement("th", { className: "px-6 py-3", __source: { fileName: "", lineNumber: 29, columnNumber: 17 }, __self: this }, "Description"), /*#__PURE__*/ React.createElement("th", { className: "px-6 py-3", __source: { fileName: "", lineNumber: 30, columnNumber: 17 }, __self: this }, "Amount"), /*#__PURE__*/ React.createElement("th", { className: "px-6 py-3", __source: { fileName: "", lineNumber: 31, columnNumber: 17 }, __self: this }, "Category"), /*#__PURE__*/ React.createElement("th", { className: "px-6 py-3", __source: { fileName: "", lineNumber: 32, columnNumber: 17 }, __self: this }, "Status"))), /*#__PURE__*/ React.createElement("tbody", { className: "divide-y bg-white", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, ` @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } `)); }