function MainComponent() { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen p-4 bg-[#F3F4F6]", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full py-4 bg-[#1E293B] text-white", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto flex justify-between items-center", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-bold text-xl md:text-2xl font-roboto", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, "HostelHaven"), /*#__PURE__*/ React.createElement("nav", { __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 8, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "font-roboto", __source: { fileName: "", lineNumber: 9, columnNumber: 15 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("li", { className: "font-roboto", __source: { fileName: "", lineNumber: 10, columnNumber: 15 }, __self: this }, "Features"), /*#__PURE__*/ React.createElement("li", { className: "font-roboto", __source: { fileName: "", lineNumber: 11, columnNumber: 15 }, __self: this }, "Pricing"), /*#__PURE__*/ React.createElement("li", { className: "font-roboto", __source: { fileName: "", lineNumber: 12, columnNumber: 15 }, __self: this }, "Contact"))))), /*#__PURE__*/ React.createElement("main", { className: "container mx-auto mt-10", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "text-center mb-10", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-semibold font-roboto text-[#1E293B]", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, "Comfortable & Affordable Hostel Rooms"), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, "Discover a place you'll love to live.")), /*#__PURE__*/ React.createElement("section", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "images/hostel1.jpg", alt: "Comfortable single room", className: "w-full h-[200px] object-cover", __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto font-semibold text-lg text-[#1E293B]", __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, "Single Room"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mt-1 font-roboto", __source: { fileName: "", lineNumber: 27, columnNumber: 15 }, __self: this }, "Perfect for solo travelers"))), /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "images/hostel2.jpg", alt: "Cozy double room", className: "w-full h-[200px] object-cover", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto font-semibold text-lg text-[#1E293B]", __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this }, "Double Room"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mt-1 font-roboto", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, "Ideal for couples or friends"))), /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "images/hostel3.jpg", alt: "Spacious dormitory room", className: "w-full h-[200px] object-cover", __source: { fileName: "", lineNumber: 38, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto font-semibold text-lg text-[#1E293B]", __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }, "Dormitory"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mt-1 font-roboto", __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, "Stay in a shared space")))), /*#__PURE__*/ React.createElement("section", { className: "my-16", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-center text-2xl font-semibold font-roboto text-[#1E293B]", __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this }, "Book Your Stay"), /*#__PURE__*/ React.createElement("form", { className: "max-w-md mx-auto mt-8", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "name", className: "block text-[#1E293B] font-roboto", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", className: "w-full p-2 border border-[#D1D5DB] rounded mt-1 font-roboto", __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "block text-[#1E293B] font-roboto", __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", className: "w-full p-2 border border-[#D1D5DB] rounded mt-1 font-roboto", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "roomType", className: "block text-[#1E293B] font-roboto", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }, "Room Type"), /*#__PURE__*/ React.createElement("select", { name: "roomType", className: "w-full p-2 border border-[#D1D5DB] rounded mt-1 font-roboto", __source: { fileName: "", lineNumber: 58, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "single", __source: { fileName: "", lineNumber: 59, columnNumber: 17 }, __self: this }, "Single"), /*#__PURE__*/ React.createElement("option", { value: "double", __source: { fileName: "", lineNumber: 60, columnNumber: 17 }, __self: this }, "Double"), /*#__PURE__*/ React.createElement("option", { value: "dormitory", __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, "Dormitory"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#2563EB] text-white px-4 py-2 rounded hover:bg-[#1D4ED8] font-roboto", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "Book Now"))))), /*#__PURE__*/ React.createElement("footer", { className: "w-full py-4 bg-[#1E293B] text-white mt-10", __source: { fileName: "", lineNumber: 70, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto text-center", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, "© ", new Date().getFullYear(), " HostelHaven. All Rights Reserved.")))); }