[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_325":326,"_327":328},"routes/_app.x.$handle.$name",{"_105":104,"_37":50,"_114":95,"_32":115,"_13":14,"_116":-5,"_11":117,"_118":119,"_120":121,"_122":123,"_124":125,"_26":-5,"_126":-5,"_127":-5,"_128":30,"_129":130,"_131":30,"_132":-5,"_133":-5,"_134":135},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_48":49,"_37":50,"_43":51,"_52":-5,"_53":30,"_54":55,"_56":55,"_57":58,"_59":-5,"_19":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":72,"_73":74,"_75":76,"_77":-5,"_78":79,"_80":79,"_81":82,"_83":82,"_84":82,"_85":79,"_86":79,"_87":88,"_89":90,"_91":92,"_93":30},"version",14,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","a00b25a8-fdb9-491f-b025-a2617dad08e5","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":14,"_46":47,"_29":30},"previous","deleted",false,"deletedHere","path","frontend/pages/ContactPage.tsx","latestPath","fileId","1d1a0e78-5478-11f1-9aa7-ee650bb23af1","name","ContactPage.tsx","fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport { COLORS, FONTS, btnPrimary, inputStyle, labelStyle, cardStyle } from \"../styles.ts\";\n\nexport function ContactPage({ notify }: { notify: (msg: string, type?: \"success\" | \"error\") => void }) {\n const [form, setForm] = useState({ name: \"\", email: \"\", subject: \"\", message: \"\" });\n\n return (\n

Get In Touch

Contact Us

\n\n

\n {/* Contact Info */}\n

We'd Love to Hear From You

\n Have questions or need assistance? Our team is available 24/7 to help make your stay perfect.\n

\n {[\n { icon: \"📍\", title: \"Address\", info: \"123 Luxury Lane, Bandra West, Mumbai, Maharashtra 400050\" },\n { icon: \"📞\", title: \"Phone\", info: \"+91 98765 43210 / +91 22 1234 5678\" },\n { icon: \"✉️\", title: \"Email\", info: \"info@grandpalace.com / reservations@grandpalace.com\" },\n { icon: \"🕐\", title: \"Hours\", info: \"24/7 — Front Desk Always Open\" },\n ].map((item, i) => (\n

{item.icon}

{item.title}

{item.info}

\n ))}\n

\n\n {/* Contact Form */}\n

Send a Message

\n Your Name *\n setForm({ ...form, name: e.target.value })} placeholder=\"John Doe\" />\n

\n Email Address *\n setForm({ ...form, email: e.target.value })} placeholder=\"john@example.com\" />\n

\n Subject\n setForm({ ...form, subject: e.target.value })} placeholder=\"Reservation inquiry\" />\n

\n Message *\n

setForm({ ...form, message: e.target.value })} placeholder=\"How can we help you?\" />\n              </div>\n              <button onClick={() => {\n                if (!form.name || !form.email || !form.message) { notify(\"Please fill required fields\", \"error\"); return; }\n                notify(\"Message sent! We'll get back to you shortly.\");\n                setForm({ name: \"\", email: \"\", subject: \"\", message: \"\" });\n              }} style={{ ...btnPrimary, borderRadius: 10, width: \"100%\" }}>\n                Send Message ✉️\n              </button>\n            </div>\n          </div>\n        </div>\n      </section>\n    </div>\n  );\n}\n","createdAt",["D",1779301028614],"branchVersion","branchId","d0b08cd4-5476-11f1-8c7b-ee650bb23af1","id","d0aff83c-5476-11f1-8c7b-ee650bb23af1","hotel-management-system",["D",1779300470926],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Hotel Management System with booking and admin dashboard","imageUrl","5138eb81-3626-4840-b1ca-0abc18aedd8e","pinnedFileId","84269d84-5478-11f1-bcbe-ee650bb23af1","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019e468f-68c7-7406-b555-8773ef996dfe","tursoName","d0aff83c547611f18c7bee650bb23af1","tursoHostname","d0aff83c547611f18c7bee650bb23af1-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789501878689],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_105":104,"_113":109},"org",{"_105":104,"_106":107,"_108":109,"_19":60,"_110":111,"_112":30},"branch",{"_13":94,"_37":95,"_48":47,"_96":49,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":50,"_103":104},"isOwned",26,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","shreyaspande","handle","displayName","Shreyas Pande","avatar","https://lh3.googleusercontent.com/a/ACg8ocIkdfPcaS5_wLwRBiJoDhq3IPXpbhOANLggiDpCsaklNbLfiZc=s96-c","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_48":49,"_37":50,"_43":320,"_52":-5,"_53":30,"_54":55,"_56":55,"_57":58,"_59":-5,"_19":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":72,"_73":74,"_75":321,"_77":-5,"_78":79,"_80":79,"_81":82,"_83":82,"_84":82,"_85":79,"_86":79,"_87":322,"_89":323,"_91":324,"_93":30},"tree",[179,181,184,197],"files",[179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197],"counts",{"_169":68,"_170":144,"_171":68,"_172":173,"_174":175},"contents",[136,137,138,139],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_48":163,"_37":164,"_35":165,"_143":-5,"_46":47,"_45":166,"_145":64,"_43":167,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_32":168},{"_48":157,"_37":158,"_35":159,"_143":-5,"_46":47,"_45":160,"_145":64,"_43":161,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_32":162},{"_48":150,"_37":151,"_35":152,"_143":-5,"_46":47,"_45":153,"_145":64,"_43":154,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_32":156},{"_48":140,"_37":141,"_35":142,"_143":-5,"_46":47,"_45":144,"_145":30,"_43":146,"_13":68,"_39":26,"_41":147,"_29":30,"_148":-5,"_32":149},"db098686-5476-11f1-8c43-ee650bb23af1","README.md","db098730-5476-11f1-8c43-ee650bb23af1","parentId",1,"latest",["D",1779300488272],"# hotel-management-system","label",[141],"8ea80f1e-5477-11f1-9426-ee650bb23af1","frontend","db2c79df-bf9c-4876-abb0-6b868c922d1e",5,["D",1779300789627],"directory",[151],"e9b7e894-5476-11f1-8c7b-ee650bb23af1","database","582166b8-a95d-4416-826e-7b81083aac44",2,["D",1779300512907],[158],"0501e974-5477-11f1-bf00-ee650bb23af1","api","6d8b275f-0e99-4398-9f97-6884fc7db2af",4,["D",1779300558691],[164],"pulls","branches","forks","envVars",{"_176":68,"_178":68},"connections",{"_176":68,"_177":68},"count","unfilledCount","emptyCount",{"_48":163,"_37":164,"_35":165,"_143":-5,"_46":47,"_45":166,"_145":64,"_43":317,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_199":318,"_32":319},{"_48":310,"_37":311,"_35":312,"_143":165,"_46":47,"_45":166,"_145":64,"_43":313,"_13":68,"_39":40,"_41":314,"_29":30,"_148":-5,"_199":315,"_32":316},{"_48":157,"_37":158,"_35":159,"_143":-5,"_46":47,"_45":160,"_145":64,"_43":307,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_199":308,"_32":309},{"_48":299,"_37":300,"_35":301,"_143":159,"_46":47,"_45":302,"_145":64,"_43":303,"_13":68,"_39":40,"_41":304,"_29":30,"_148":-5,"_199":305,"_32":306},{"_48":292,"_37":293,"_35":294,"_143":159,"_46":47,"_45":160,"_145":64,"_43":295,"_13":68,"_39":40,"_41":296,"_29":30,"_148":-5,"_199":297,"_32":298},{"_48":150,"_37":151,"_35":152,"_143":-5,"_46":47,"_45":153,"_145":64,"_43":289,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_199":290,"_32":291},{"_48":285,"_37":268,"_35":262,"_143":152,"_46":47,"_45":263,"_145":64,"_43":286,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_199":287,"_32":288},{"_48":277,"_37":278,"_35":279,"_143":262,"_46":47,"_45":280,"_145":64,"_43":281,"_13":68,"_39":40,"_41":282,"_29":30,"_148":-5,"_199":283,"_32":284},{"_48":269,"_37":270,"_35":271,"_143":262,"_46":47,"_45":272,"_145":64,"_43":273,"_13":68,"_39":40,"_41":274,"_29":30,"_148":-5,"_199":275,"_32":276},{"_48":259,"_37":260,"_35":261,"_143":262,"_46":47,"_45":263,"_145":64,"_43":264,"_13":68,"_39":40,"_41":265,"_29":30,"_148":-5,"_199":266,"_32":267},{"_48":255,"_37":226,"_35":220,"_143":152,"_46":47,"_45":230,"_145":64,"_43":256,"_13":68,"_39":155,"_41":-5,"_29":30,"_148":-5,"_199":257,"_32":258},{"_48":247,"_37":248,"_35":249,"_143":220,"_46":47,"_45":250,"_145":64,"_43":251,"_13":68,"_39":40,"_41":252,"_29":30,"_148":-5,"_199":253,"_32":254},{"_48":239,"_37":240,"_35":241,"_143":220,"_46":47,"_45":242,"_145":64,"_43":243,"_13":68,"_39":40,"_41":244,"_29":30,"_148":-5,"_199":245,"_32":246},{"_48":235,"_37":38,"_35":36,"_143":220,"_46":47,"_45":14,"_145":64,"_43":236,"_13":68,"_39":40,"_41":42,"_29":30,"_148":-5,"_199":237,"_32":238},{"_48":227,"_37":228,"_35":229,"_143":220,"_46":47,"_45":230,"_145":64,"_43":231,"_13":68,"_39":40,"_41":232,"_29":30,"_148":-5,"_199":233,"_32":234},{"_48":217,"_37":218,"_35":219,"_143":220,"_46":47,"_45":221,"_145":64,"_43":222,"_13":68,"_39":40,"_41":223,"_29":30,"_148":-5,"_199":224,"_32":225},{"_48":210,"_37":211,"_35":212,"_143":152,"_46":47,"_45":153,"_145":64,"_43":213,"_13":68,"_39":40,"_41":214,"_29":30,"_148":-5,"_199":215,"_32":216},{"_48":202,"_37":203,"_35":204,"_143":152,"_46":47,"_45":205,"_145":64,"_43":206,"_13":68,"_39":40,"_41":207,"_29":30,"_148":-5,"_199":208,"_32":209},{"_48":140,"_37":141,"_35":142,"_143":-5,"_46":47,"_45":144,"_145":30,"_43":198,"_13":68,"_39":26,"_41":147,"_29":30,"_148":-5,"_199":200,"_32":201},["D",1779300488272],"children",[],[141],"97b313ba-5477-11f1-8ca8-ee650bb23af1","styles.ts","97b314e6-5477-11f1-8ca8-ee650bb23af1",6,["D",1779300804802],"// Shared styles and theme constants\nexport const COLORS = {\n  primary: \"#1a1a2e\",\n  primaryLight: \"#16213e\",\n  accent: \"#e94560\",\n  accentHover: \"#c81e45\",\n  gold: \"#d4a853\",\n  goldLight: \"#f0d78c\",\n  white: \"#ffffff\",\n  offWhite: \"#f8f9fa\",\n  gray: \"#6c757d\",\n  grayLight: \"#e9ecef\",\n  grayDark: \"#343a40\",\n  success: \"#10b981\",\n  warning: \"#f59e0b\",\n  danger: \"#ef4444\",\n  info: \"#3b82f6\",\n  bg: \"#f0f2f5\",\n};\n\nexport const FONTS = {\n  heading: \"'Playfair Display', serif\",\n  body: \"'Inter', sans-serif\",\n};\n\nexport const cardStyle: React.CSSProperties = {\n  background: \"#fff\",\n  borderRadius: 16,\n  boxShadow: \"0 2px 12px rgba(0,0,0,0.06)\",\n  padding: 24,\n};\n\nexport const btnPrimary: React.CSSProperties = {\n  background: COLORS.accent,\n  color: \"#fff\",\n  border: \"none\",\n  padding: \"12px 28px\",\n  borderRadius: 8,\n  fontWeight: 600,\n  fontSize: 15,\n  cursor: \"pointer\",\n  transition: \"all 0.2s\",\n  fontFamily: FONTS.body,\n};\n\nexport const btnOutline: React.CSSProperties = {\n  background: \"transparent\",\n  color: COLORS.accent,\n  border: `2px solid ${COLORS.accent}`,\n  padding: \"10px 24px\",\n  borderRadius: 8,\n  fontWeight: 600,\n  fontSize: 15,\n  cursor: \"pointer\",\n  transition: \"all 0.2s\",\n  fontFamily: FONTS.body,\n};\n\nexport const btnGold: React.CSSProperties = {\n  background: `linear-gradient(135deg, ${COLORS.gold}, ${COLORS.goldLight})`,\n  color: COLORS.primary,\n  border: \"none\",\n  padding: \"12px 28px\",\n  borderRadius: 8,\n  fontWeight: 700,\n  fontSize: 15,\n  cursor: \"pointer\",\n  transition: \"all 0.2s\",\n  fontFamily: FONTS.body,\n};\n\nexport const inputStyle: React.CSSProperties = {\n  width: \"100%\",\n  padding: \"12px 16px\",\n  borderRadius: 8,\n  border: \"1px solid #ddd\",\n  fontSize: 15,\n  fontFamily: FONTS.body,\n  outline: \"none\",\n  transition: \"border-color 0.2s\",\n  boxSizing: \"border-box\",\n};\n\nexport const labelStyle: React.CSSProperties = {\n  fontSize: 13,\n  fontWeight: 600,\n  color: COLORS.grayDark,\n  marginBottom: 4,\n  display: \"block\",\n  fontFamily: FONTS.body,\n};\n\nexport const tableStyle: React.CSSProperties = {\n  width: \"100%\",\n  borderCollapse: \"collapse\" as const,\n  fontSize: 14,\n  fontFamily: FONTS.body,\n};\n\nexport const thStyle: React.CSSProperties = {\n  padding: \"12px 16px\",\n  textAlign: \"left\" as const,\n  background: COLORS.primary,\n  color: \"#fff\",\n  fontWeight: 600,\n  fontSize: 13,\n  textTransform: \"uppercase\" as const,\n  letterSpacing: \"0.5px\",\n};\n\nexport const tdStyle: React.CSSProperties = {\n  padding: \"12px 16px\",\n  borderBottom: \"1px solid #eee\",\n};\n\nexport const badgeStyle = (color: string): React.CSSProperties => ({\n  display: \"inline-block\",\n  padding: \"4px 12px\",\n  borderRadius: 20,\n  fontSize: 12,\n  fontWeight: 600,\n  background: color + \"18\",\n  color: color,\n});\n\nexport const statusColor = (status: string): string => {\n  const map: Record<string, string> = {\n    available: COLORS.success,\n    booked: COLORS.info,\n    maintenance: COLORS.warning,\n    confirmed: COLORS.info,\n    checked_in: COLORS.success,\n    checked_out: COLORS.gray,\n    cancelled: COLORS.danger,\n    paid: COLORS.success,\n    pending: COLORS.warning,\n    active: COLORS.success,\n    inactive: COLORS.gray,\n    completed: COLORS.success,\n  };\n  return map[status] || COLORS.gray;\n};\n",[],[151,203],"8ea7e976-5477-11f1-9426-ee650bb23af1","App.tsx","8ea7ea5c-5477-11f1-9426-ee650bb23af1",["D",1779300789627],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { HomePage } from \"./pages/HomePage.tsx\";\nimport { RoomsPage } from \"./pages/RoomsPage.tsx\";\nimport { BookingPage } from \"./pages/BookingPage.tsx\";\nimport { AboutPage } from \"./pages/AboutPage.tsx\";\nimport { ContactPage } from \"./pages/ContactPage.tsx\";\nimport { LoginPage } from \"./pages/LoginPage.tsx\";\nimport { AdminDashboard } from \"./pages/AdminDashboard.tsx\";\nimport { AdminRooms } from \"./pages/AdminRooms.tsx\";\nimport { AdminCustomers } from \"./pages/AdminCustomers.tsx\";\nimport { AdminBookings } from \"./pages/AdminBookings.tsx\";\nimport { AdminEmployees } from \"./pages/AdminEmployees.tsx\";\nimport { AdminFeedback } from \"./pages/AdminFeedback.tsx\";\nimport { AdminPayments } from \"./pages/AdminPayments.tsx\";\nimport { Navbar } from \"./components/Navbar.tsx\";\nimport { Footer } from \"./components/Footer.tsx\";\nimport { AdminSidebar } from \"./components/AdminSidebar.tsx\";\n\nexport type Page = \"home\" | \"rooms\" | \"booking\" | \"about\" | \"contact\" | \"login\"\n  | \"admin-dashboard\" | \"admin-rooms\" | \"admin-customers\" | \"admin-bookings\"\n  | \"admin-employees\" | \"admin-feedback\" | \"admin-payments\";\n\nexport interface User {\n  id: number;\n  username: string;\n  full_name: string;\n  email: string;\n  role: string;\n}\n\nexport function App() {\n  const [page, setPage] = useState<Page>(\"home\");\n  const [user, setUser] = useState<User | null>(null);\n  const [notification, setNotification] = useState<{ message: string; type: \"success\" | \"error\" } | null>(null);\n\n  const isAdmin = page.startsWith(\"admin-\");\n\n  const showNotification = useCallback((message: string, type: \"success\" | \"error\" = \"success\") => {\n    setNotification({ message, type });\n    setTimeout(() => setNotification(null), 3500);\n  }, []);\n\n  const handleLogout = () => {\n    setUser(null);\n    setPage(\"home\");\n    showNotification(\"Logged out successfully\");\n  };\n\n  const handleLogin = (u: User) => {\n    setUser(u);\n    setPage(\"admin-dashboard\");\n    showNotification(`Welcome back, ${u.full_name}!`);\n  };\n\n  // Render admin layout\n  if (isAdmin && user) {\n    return (\n      <div style={{ display: \"flex\", minHeight: \"100vh\", background: \"#f0f2f5\" }}>\n        {notification && <Toast message={notification.message} type={notification.type} />}\n        <AdminSidebar page={page} setPage={setPage} user={user} onLogout={handleLogout} />\n        <div style={{ flex: 1, overflow: \"auto\" }}>\n          {page === \"admin-dashboard\" && <AdminDashboard />}\n          {page === \"admin-rooms\" && <AdminRooms notify={showNotification} />}\n          {page === \"admin-customers\" && <AdminCustomers notify={showNotification} />}\n          {page === \"admin-bookings\" && <AdminBookings notify={showNotification} />}\n          {page === \"admin-employees\" && <AdminEmployees notify={showNotification} />}\n          {page === \"admin-feedback\" && <AdminFeedback />}\n          {page === \"admin-payments\" && <AdminPayments />}\n        </div>\n      </div>\n    );\n  }\n\n  // Protect admin pages\n  if (isAdmin && !user) {\n    return (\n      <>\n        {notification && <Toast message={notification.message} type={notification.type} />}\n        <Navbar page=\"login\" setPage={setPage} user={user} onLogout={handleLogout} />\n        <LoginPage onLogin={handleLogin} notify={showNotification} />\n        <Footer setPage={setPage} />\n      </>\n    );\n  }\n\n  return (\n    <>\n      {notification && <Toast message={notification.message} type={notification.type} />}\n      <Navbar page={page} setPage={setPage} user={user} onLogout={handleLogout} />\n      {page === \"home\" && <HomePage setPage={setPage} />}\n      {page === \"rooms\" && <RoomsPage setPage={setPage} />}\n      {page === \"booking\" && <BookingPage notify={showNotification} />}\n      {page === \"about\" && <AboutPage />}\n      {page === \"contact\" && <ContactPage notify={showNotification} />}\n      {page === \"login\" && <LoginPage onLogin={handleLogin} notify={showNotification} />}\n      <Footer setPage={setPage} />\n    </>\n  );\n}\n\nfunction Toast({ message, type }: { message: string; type: \"success\" | \"error\" }) {\n  return (\n    <div style={{\n      position: \"fixed\", top: 24, right: 24, zIndex: 10000,\n      background: type === \"success\" ? \"#10b981\" : \"#ef4444\",\n      color: \"#fff\", padding: \"14px 28px\", borderRadius: 12,\n      boxShadow: \"0 8px 32px rgba(0,0,0,0.18)\", fontSize: 15, fontWeight: 600,\n      display: \"flex\", alignItems: \"center\", gap: 10,\n      animation: \"slideIn 0.3s ease-out\",\n    }}>\n      <span>{type === \"success\" ? \"✓\" : \"✕\"}</span>\n      {message}\n    </div>\n  );\n}\n",[],[151,211],"e6232580-5477-11f1-bb37-ee650bb23af1","RoomsPage.tsx","e623262a-5477-11f1-bb37-ee650bb23af1","b76e3807-c92b-4298-bff5-d48e1c3d3690",11,["D",1779300936369],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport type { Page } from \"../App.tsx\";\nimport { COLORS, FONTS, btnPrimary, badgeStyle, statusColor } from \"../styles.ts\";\n\nconst gradients = [\n  \"linear-gradient(135deg, #667eea, #764ba2)\",\n  \"linear-gradient(135deg, #f093fb, #f5576c)\",\n  \"linear-gradient(135deg, #4facfe, #00f2fe)\",\n  \"linear-gradient(135deg, #43e97b, #38f9d7)\",\n  \"linear-gradient(135deg, #fa709a, #fee140)\",\n  \"linear-gradient(135deg, #a18cd1, #fbc2eb)\",\n  \"linear-gradient(135deg, #fccb90, #d57eeb)\",\n  \"linear-gradient(135deg, #667eea, #f5576c)\",\n];\n\nconst roomIcons: Record<string, string> = { Standard: \"🛏️\", Deluxe: \"🌟\", Suite: \"👑\" };\n\nexport function RoomsPage({ setPage }: { setPage: (p: Page) => void }) {\n  const [rooms, setRooms] = useState<any[]>([]);\n  const [filter, setFilter] = useState(\"all\");\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    fetch(\"/api/rooms\").then(r => r.json()).then(data => { setRooms(data); setLoading(false); });\n  }, []);\n\n  const filtered = filter === \"all\" ? rooms : rooms.filter(r => r.room_type === filter);\n\n  return (\n    <div style={{ paddingTop: 72 }}>\n      {/* Header */}\n      <section style={{\n        padding: \"60px 48px\",\n        background: `linear-gradient(135deg, ${COLORS.primary}, ${COLORS.primaryLight})`,\n        textAlign: \"center\", color: \"#fff\",\n      }}>\n        <div style={{ fontSize: 12, letterSpacing: 4, color: COLORS.gold, textTransform: \"uppercase\", fontWeight: 600, marginBottom: 12 }}>Accommodations</div>\n        <h1 style={{ fontFamily: FONTS.heading, fontSize: 48, marginBottom: 16 }}>Our <span style={{ color: COLORS.gold }}>Rooms & Suites</span></h1>\n        <p style={{ color: \"rgba(255,255,255,0.6)\", fontSize: 17, maxWidth: 600, margin: \"0 auto\" }}>\n          Discover our handpicked collection of rooms designed for your utmost comfort.\n        </p>\n      </section>\n\n      {/* Filter */}\n      <section style={{ padding: \"32px 48px\", background: \"#fff\", borderBottom: \"1px solid #eee\" }}>\n        <div style={{ maxWidth: 1200, margin: \"0 auto\", display: \"flex\", gap: 12, justifyContent: \"center\" }}>\n          {[\"all\", \"Standard\", \"Deluxe\", \"Suite\"].map(f => (\n            <button key={f} onClick={() => setFilter(f)} style={{\n              padding: \"10px 28px\", borderRadius: 30,\n              background: filter === f ? COLORS.accent : \"transparent\",\n              color: filter === f ? \"#fff\" : COLORS.grayDark,\n              border: filter === f ? \"none\" : `1px solid #ddd`,\n              fontWeight: 600, fontSize: 14, cursor: \"pointer\", fontFamily: FONTS.body,\n              textTransform: \"capitalize\",\n            }}>{f === \"all\" ? \"All Rooms\" : f}</button>\n          ))}\n        </div>\n      </section>\n\n      {/* Room Grid */}\n      <section style={{ padding: \"48px\", background: COLORS.offWhite }}>\n        <div style={{ maxWidth: 1200, margin: \"0 auto\" }}>\n          {loading ? (\n            <div style={{ textAlign: \"center\", padding: 60, color: COLORS.gray }}>Loading rooms...</div>\n          ) : (\n            <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(auto-fill, minmax(350, 1fr))\", gap: 28 }}>\n              {filtered.map((room, i) => (\n                <div key={room.id} style={{\n                  background: \"#fff\", borderRadius: 20, overflow: \"hidden\",\n                  boxShadow: \"0 4px 20px rgba(0,0,0,0.06)\", transition: \"transform 0.2s\",\n                }}>\n                  {/* Room Image */}\n                  <div style={{\n                    height: 180, background: gradients[i % gradients.length],\n                    display: \"flex\", alignItems: \"center\", justifyContent: \"center\", position: \"relative\",\n                  }}>\n                    <span style={{ fontSize: 56 }}>{roomIcons[room.room_type] || \"🏠\"}</span>\n                    <div style={{ position: \"absolute\", top: 12, left: 12, ...badgeStyle(statusColor(room.status)), fontSize: 11, textTransform: \"uppercase\" }}>\n                      {room.status}\n                    </div>\n                    <div style={{ position: \"absolute\", top: 12, right: 12, background: \"rgba(0,0,0,0.4)\", color: \"#fff\", padding: \"4px 12px\", borderRadius: 8, fontSize: 12, fontWeight: 600 }}>\n                      Room {room.room_number}\n                    </div>\n                  </div>\n\n                  {/* Room Info */}\n                  <div style={{ padding: 24 }}>\n                    <div style={{ display: \"flex\", justifyContent: \"space-between\", alignItems: \"start\", marginBottom: 12 }}>\n                      <div>\n                        <h3 style={{ fontFamily: FONTS.heading, fontSize: 22, color: COLORS.primary, marginBottom: 4 }}>\n                          {room.room_type} Room\n                        </h3>\n                        <div style={{ fontSize: 13, color: COLORS.gray }}>Floor {room.floor} • {room.ac_type} • Max {room.max_guests} guests</div>\n                      </div>\n                    </div>\n                    <p style={{ fontSize: 14, color: COLORS.gray, lineHeight: 1.6, marginBottom: 16, minHeight: 42 }}>\n                      {room.description || \"A comfortable room with modern amenities.\"}\n                    </p>\n                    <div style={{ display: \"flex\", gap: 6, flexWrap: \"wrap\", marginBottom: 20 }}>\n                      {[\"WiFi\", \"TV\", \"Minibar\", room.ac_type].map(f => (\n                        <span key={f} style={{ fontSize: 11, padding: \"3px 10px\", borderRadius: 6, background: COLORS.offWhite, color: COLORS.grayDark }}>✓ {f}</span>\n                      ))}\n                    </div>\n                    <div style={{ display: \"flex\", justifyContent: \"space-between\", alignItems: \"center\", borderTop: \"1px solid #f0f0f0\", paddingTop: 16 }}>\n                      <div>\n                        <span style={{ fontFamily: FONTS.heading, fontSize: 26, fontWeight: 700, color: COLORS.accent }}>\n                          ₹{room.price_per_night?.toLocaleString()}\n                        </span>\n                        <span style={{ fontSize: 13, color: COLORS.gray }}> / night</span>\n                      </div>\n                      <button\n                        onClick={() => room.status === \"available\" && setPage(\"booking\")}\n                        disabled={room.status !== \"available\"}\n                        style={{\n                          ...btnPrimary,\n                          padding: \"10px 24px\", borderRadius: 10, fontSize: 13,\n                          opacity: room.status !== \"available\" ? 0.5 : 1,\n                          cursor: room.status !== \"available\" ? \"not-allowed\" : \"pointer\",\n                        }}\n                      >\n                        {room.status === \"available\" ? \"Book Now\" : room.status === \"booked\" ? \"Occupied\" : \"Unavailable\"}\n                      </button>\n                    </div>\n                  </div>\n                </div>\n              ))}\n            </div>\n          )}\n        </div>\n      </section>\n    </div>\n  );\n}\n",[],[151,226,218],"pages","d6487b88-5477-11f1-8ca8-ee650bb23af1","HomePage.tsx","d6487ca0-5477-11f1-8ca8-ee650bb23af1",10,["D",1779300909794],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport type { Page } from \"../App.tsx\";\nimport { COLORS, FONTS, btnPrimary, btnGold } from \"../styles.ts\";\n\nexport function HomePage({ setPage }: { setPage: (p: Page) => void }) {\n  const [stats, setStats] = useState<any>(null);\n\n  useEffect(() => {\n    fetch(\"/api/dashboard\").then(r => r.json()).then(setStats).catch(() => {});\n  }, []);\n\n  return (\n    <div>\n      {/* Hero Section */}\n      <section style={{\n        minHeight: \"100vh\",\n        background: `linear-gradient(135deg, rgba(26,26,46,0.92), rgba(22,33,62,0.88)),\n          url('https://images.unsplash.com/photo-1566073771259-6a8506099945?w=1920&q=80') center/cover`,\n        display: \"flex\", alignItems: \"center\", justifyContent: \"center\",\n        textAlign: \"center\", color: \"#fff\", position: \"relative\",\n      }}>\n        <div style={{ maxWidth: 800, padding: \"0 24px\" }}>\n          <div style={{\n            fontSize: 13, letterSpacing: 6, textTransform: \"uppercase\",\n            color: COLORS.gold, marginBottom: 24, fontWeight: 500,\n          }}>\n            ★★★★★ Luxury Hotel & Resort\n          </div>\n          <h1 style={{\n            fontFamily: FONTS.heading, fontSize: 64, fontWeight: 700,\n            lineHeight: 1.1, marginBottom: 24,\n          }}>\n            Experience <span style={{ color: COLORS.gold }}>Unparalleled</span> Luxury\n          </h1>\n          <p style={{ fontSize: 18, color: \"rgba(255,255,255,0.75)\", lineHeight: 1.7, marginBottom: 40, maxWidth: 600, margin: \"0 auto 40px\" }}>\n            Immerse yourself in elegance at Grand Palace Hotels & Resorts. Where world-class hospitality meets timeless sophistication.\n          </p>\n          <div style={{ display: \"flex\", gap: 16, justifyContent: \"center\" }}>\n            <button onClick={() => setPage(\"booking\")} style={{ ...btnGold, padding: \"16px 40px\", fontSize: 16, borderRadius: 12 }}>\n              Book Your Stay →\n            </button>\n            <button onClick={() => setPage(\"rooms\")} style={{\n              ...btnPrimary, background: \"transparent\", border: \"2px solid rgba(255,255,255,0.3)\",\n              padding: \"14px 36px\", fontSize: 16, borderRadius: 12,\n            }}>\n              Explore Rooms\n            </button>\n          </div>\n        </div>\n\n        {/* Search Bar */}\n        <div style={{\n          position: \"absolute\", bottom: -40, left: \"50%\", transform: \"translateX(-50%)\",\n          background: \"#fff\", borderRadius: 16, padding: \"24px 32px\",\n          boxShadow: \"0 20px 60px rgba(0,0,0,0.15)\",\n          display: \"flex\", gap: 16, alignItems: \"flex-end\", zIndex: 10,\n        }}>\n          {[\n            { label: \"Check In\", type: \"date\" },\n            { label: \"Check Out\", type: \"date\" },\n            { label: \"Guests\", type: \"select\", options: [\"1 Guest\", \"2 Guests\", \"3 Guests\", \"4 Guests\"] },\n            { label: \"Room Type\", type: \"select\", options: [\"All Types\", \"Standard\", \"Deluxe\", \"Suite\"] },\n          ].map((field, i) => (\n            <div key={i} style={{ minWidth: 160 }}>\n              <label style={{ fontSize: 11, fontWeight: 700, color: COLORS.gray, textTransform: \"uppercase\", letterSpacing: 1, display: \"block\", marginBottom: 6 }}>\n                {field.label}\n              </label>\n              {field.type === \"select\" ? (\n                <select style={{ padding: \"10px 14px\", borderRadius: 8, border: \"1px solid #e0e0e0\", fontSize: 14, width: \"100%\", fontFamily: FONTS.body }}>\n                  {field.options!.map(o => <option key={o}>{o}</option>)}\n                </select>\n              ) : (\n                <input type=\"date\" style={{ padding: \"10px 14px\", borderRadius: 8, border: \"1px solid #e0e0e0\", fontSize: 14, width: \"100%\", fontFamily: FONTS.body }} />\n              )}\n            </div>\n          ))}\n          <button onClick={() => setPage(\"rooms\")} style={{ ...btnPrimary, padding: \"12px 32px\", borderRadius: 10, whiteSpace: \"nowrap\" }}>\n            🔍 Search\n          </button>\n        </div>\n      </section>\n\n      {/* Stats Bar */}\n      <section style={{ background: COLORS.primaryLight, padding: \"80px 48px 40px\" }}>\n        <div style={{ maxWidth: 1000, margin: \"0 auto\", display: \"grid\", gridTemplateColumns: \"repeat(4, 1fr)\", gap: 32, textAlign: \"center\" }}>\n          {[\n            { num: stats?.totalRooms || \"50+\", label: \"Luxury Rooms\", icon: \"🛏️\" },\n            { num: \"4.8\", label: \"Guest Rating\", icon: \"⭐\" },\n            { num: \"10K+\", label: \"Happy Guests\", icon: \"😊\" },\n            { num: \"15+\", label: \"Years of Excellence\", icon: \"🏆\" },\n          ].map((s, i) => (\n            <div key={i}>\n              <div style={{ fontSize: 36, marginBottom: 8 }}>{s.icon}</div>\n              <div style={{ fontFamily: FONTS.heading, fontSize: 36, fontWeight: 700, color: COLORS.gold }}>{s.num}</div>\n              <div style={{ fontSize: 14, color: \"rgba(255,255,255,0.6)\" }}>{s.label}</div>\n            </div>\n          ))}\n        </div>\n      </section>\n\n      {/* Room Types */}\n      <section style={{ padding: \"80px 48px\", background: \"#fff\" }}>\n        <div style={{ maxWidth: 1200, margin: \"0 auto\" }}>\n          <div style={{ textAlign: \"center\", marginBottom: 60 }}>\n            <div style={{ fontSize: 12, letterSpacing: 4, color: COLORS.gold, textTransform: \"uppercase\", fontWeight: 600, marginBottom: 12 }}>Our Accommodations</div>\n            <h2 style={{ fontFamily: FONTS.heading, fontSize: 42, color: COLORS.primary, marginBottom: 16 }}>Exquisite Room Collection</h2>\n            <p style={{ color: COLORS.gray, maxWidth: 600, margin: \"0 auto\", lineHeight: 1.7 }}>Choose from our carefully curated selection of rooms and suites, each designed to provide the ultimate comfort.</p>\n          </div>\n\n          <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(3, 1fr)\", gap: 32 }}>\n            {[\n              { type: \"Standard Room\", price: \"₹2,500\", desc: \"Comfortable rooms with modern amenities, perfect for business travelers.\", features: [\"Queen Bed\", \"City View\", \"Free WiFi\", \"Room Service\"], gradient: \"linear-gradient(135deg, #667eea, #764ba2)\" },\n              { type: \"Deluxe Room\", price: \"₹4,500\", desc: \"Spacious luxury rooms with panoramic views and premium furnishings.\", features: [\"King Bed\", \"Panoramic View\", \"Mini Bar\", \"Luxury Bath\"], gradient: \"linear-gradient(135deg, #f093fb, #f5576c)\" },\n              { type: \"Royal Suite\", price: \"₹8,500\", desc: \"The pinnacle of luxury with private living areas and butler service.\", features: [\"Living Area\", \"Jacuzzi\", \"Butler Service\", \"Private Terrace\"], gradient: \"linear-gradient(135deg, #4facfe, #00f2fe)\" },\n            ].map((room, i) => (\n              <div key={i} style={{\n                borderRadius: 20, overflow: \"hidden\", boxShadow: \"0 10px 40px rgba(0,0,0,0.08)\",\n                transition: \"transform 0.3s, box-shadow 0.3s\", cursor: \"pointer\",\n              }}>\n                <div style={{ height: 200, background: room.gradient, display: \"flex\", alignItems: \"center\", justifyContent: \"center\", position: \"relative\" }}>\n                  <span style={{ fontSize: 64 }}>{i === 0 ? \"🛏️\" : i === 1 ? \"🌟\" : \"👑\"}</span>\n                  <div style={{ position: \"absolute\", top: 16, right: 16, background: \"rgba(0,0,0,0.3)\", color: \"#fff\", padding: \"6px 14px\", borderRadius: 20, fontSize: 12, fontWeight: 600 }}>\n                    Popular\n                  </div>\n                </div>\n                <div style={{ padding: 28 }}>\n                  <h3 style={{ fontFamily: FONTS.heading, fontSize: 24, marginBottom: 8, color: COLORS.primary }}>{room.type}</h3>\n                  <p style={{ color: COLORS.gray, fontSize: 14, lineHeight: 1.6, marginBottom: 16 }}>{room.desc}</p>\n                  <div style={{ display: \"flex\", flexWrap: \"wrap\", gap: 8, marginBottom: 20 }}>\n                    {room.features.map(f => (\n                      <span key={f} style={{ fontSize: 12, padding: \"4px 10px\", borderRadius: 6, background: COLORS.offWhite, color: COLORS.grayDark }}>✓ {f}</span>\n                    ))}\n                  </div>\n                  <div style={{ display: \"flex\", justifyContent: \"space-between\", alignItems: \"center\" }}>\n                    <div>\n                      <span style={{ fontFamily: FONTS.heading, fontSize: 28, fontWeight: 700, color: COLORS.accent }}>{room.price}</span>\n                      <span style={{ fontSize: 13, color: COLORS.gray }}> / night</span>\n                    </div>\n                    <button onClick={() => setPage(\"booking\")} style={{ ...btnPrimary, padding: \"10px 24px\", borderRadius: 10, fontSize: 13 }}>Book Now</button>\n                  </div>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n\n      {/* Amenities */}\n      <section style={{ padding: \"80px 48px\", background: COLORS.offWhite }}>\n        <div style={{ maxWidth: 1200, margin: \"0 auto\" }}>\n          <div style={{ textAlign: \"center\", marginBottom: 60 }}>\n            <div style={{ fontSize: 12, letterSpacing: 4, color: COLORS.gold, textTransform: \"uppercase\", fontWeight: 600, marginBottom: 12 }}>World-Class Facilities</div>\n            <h2 style={{ fontFamily: FONTS.heading, fontSize: 42, color: COLORS.primary }}>Hotel Amenities</h2>\n          </div>\n          <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(4, 1fr)\", gap: 24 }}>\n            {[\n              { icon: \"🏊\", title: \"Swimming Pool\", desc: \"Infinity pool with stunning views\" },\n              { icon: \"💆\", title: \"Spa & Wellness\", desc: \"Rejuvenating treatments & therapies\" },\n              { icon: \"🍽️\", title: \"Fine Dining\", desc: \"Multi-cuisine gourmet restaurants\" },\n              { icon: \"🏋️\", title: \"Fitness Center\", desc: \"State-of-the-art gym equipment\" },\n              { icon: \"🅿️\", title: \"Free Parking\", desc: \"Complimentary valet parking\" },\n              { icon: \"📶\", title: \"High-Speed WiFi\", desc: \"Seamless connectivity throughout\" },\n              { icon: \"🧹\", title: \"Housekeeping\", desc: \"24/7 professional cleaning service\" },\n              { icon: \"🚗\", title: \"Airport Transfer\", desc: \"Luxury car pickup & drop\" },\n            ].map((a, i) => (\n              <div key={i} style={{\n                background: \"#fff\", borderRadius: 16, padding: 28, textAlign: \"center\",\n                boxShadow: \"0 2px 12px rgba(0,0,0,0.04)\", transition: \"transform 0.2s\",\n              }}>\n                <div style={{ fontSize: 40, marginBottom: 16 }}>{a.icon}</div>\n                <h4 style={{ fontFamily: FONTS.heading, fontSize: 18, marginBottom: 8, color: COLORS.primary }}>{a.title}</h4>\n                <p style={{ fontSize: 13, color: COLORS.gray }}>{a.desc}</p>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n\n      {/* Testimonials */}\n      <section style={{ padding: \"80px 48px\", background: \"#fff\" }}>\n        <div style={{ maxWidth: 1000, margin: \"0 auto\", textAlign: \"center\" }}>\n          <div style={{ fontSize: 12, letterSpacing: 4, color: COLORS.gold, textTransform: \"uppercase\", fontWeight: 600, marginBottom: 12 }}>Guest Reviews</div>\n          <h2 style={{ fontFamily: FONTS.heading, fontSize: 42, color: COLORS.primary, marginBottom: 48 }}>What Our Guests Say</h2>\n          <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(3, 1fr)\", gap: 32 }}>\n            {[\n              { name: \"Rajesh K.\", text: \"Absolutely stunning hotel! The rooms were immaculate and the staff made us feel like royalty.\", rating: 5 },\n              { name: \"Sarah M.\", text: \"The best hotel experience I've ever had. The suite was breathtaking and the food was divine.\", rating: 5 },\n              { name: \"Priya S.\", text: \"Perfect for our anniversary celebration. The spa treatments were out of this world!\", rating: 4 },\n            ].map((t, i) => (\n              <div key={i} style={{ background: COLORS.offWhite, borderRadius: 16, padding: 32, textAlign: \"left\" }}>\n                <div style={{ fontSize: 16, color: COLORS.gold, marginBottom: 12 }}>{\"⭐\".repeat(t.rating)}</div>\n                <p style={{ color: COLORS.grayDark, lineHeight: 1.7, marginBottom: 20, fontSize: 15, fontStyle: \"italic\" }}>\"{t.text}\"</p>\n                <div style={{ display: \"flex\", alignItems: \"center\", gap: 12 }}>\n                  <div style={{ width: 40, height: 40, borderRadius: \"50%\", background: `linear-gradient(135deg, ${COLORS.accent}, ${COLORS.gold})`, display: \"flex\", alignItems: \"center\", justifyContent: \"center\", color: \"#fff\", fontWeight: 700 }}>\n                    {t.name.charAt(0)}\n                  </div>\n                  <div>\n                    <div style={{ fontWeight: 600, fontSize: 15 }}>{t.name}</div>\n                    <div style={{ fontSize: 12, color: COLORS.gray }}>Verified Guest</div>\n                  </div>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n\n      {/* CTA */}\n      <section style={{\n        padding: \"80px 48px\",\n        background: `linear-gradient(135deg, ${COLORS.primary}, ${COLORS.primaryLight})`,\n        textAlign: \"center\",\n      }}>\n        <h2 style={{ fontFamily: FONTS.heading, fontSize: 42, color: \"#fff\", marginBottom: 16 }}>\n          Ready for an <span style={{ color: COLORS.gold }}>Unforgettable</span> Stay?\n        </h2>\n        <p style={{ color: \"rgba(255,255,255,0.6)\", fontSize: 18, marginBottom: 36 }}>Book your room today and experience luxury like never before.</p>\n        <button onClick={() => setPage(\"booking\")} style={{ ...btnGold, padding: \"16px 48px\", fontSize: 17, borderRadius: 12 }}>\n          Reserve Your Room →\n        </button>\n      </section>\n    </div>\n  );\n}\n",[],[151,226,228],"1d1a0d88-5478-11f1-9aa7-ee650bb23af1",["D",1779301028614],[],[151,226,38],"04cffd78-5478-11f1-b964-ee650bb23af1","BookingPage.tsx","04cffe72-5478-11f1-b964-ee650bb23af1",12,["D",1779300987865],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { COLORS, FONTS, btnPrimary, inputStyle, labelStyle, cardStyle } from \"../styles.ts\";\n\nexport function BookingPage({ notify }: { notify: (msg: string, type?: \"success\" | \"error\") => void }) {\n  const [rooms, setRooms] = useState<any[]>([]);\n  const [step, setStep] = useState(1);\n  const [booking, setBooking] = useState({\n    full_name: \"\", email: \"\", phone: \"\", id_type: \"Aadhar\", id_number: \"\",\n    address: \"\", city: \"\", country: \"India\",\n    room_id: \"\", check_in: \"\", check_out: \"\", guests: 1, special_requests: \"\",\n  });\n  const [result, setResult] = useState<any>(null);\n  const [submitting, setSubmitting] = useState(false);\n\n  useEffect(() => {\n    fetch(\"/api/rooms/available\").then(r => r.json()).then(setRooms);\n  }, []);\n\n  const selectedRoom = rooms.find(r => r.id === Number(booking.room_id));\n  const nights = booking.check_in && booking.check_out\n    ? Math.ceil((new Date(booking.check_out).getTime() - new Date(booking.check_in).getTime()) / (1000 * 60 * 60 * 24))\n    : 0;\n  const total = selectedRoom ? selectedRoom.price_per_night * Math.max(nights, 0) : 0;\n  const tax = total * 0.18;\n\n  const handleSubmit = async () => {\n    if (!booking.full_name || !booking.phone || !booking.room_id || !booking.check_in || !booking.check_out) {\n      notify(\"Please fill all required fields\", \"error\");\n      return;\n    }\n    if (nights <= 0) { notify(\"Check-out must be after check-in\", \"error\"); return; }\n    setSubmitting(true);\n    try {\n      // Create customer first\n      const custRes = await fetch(\"/api/customers\", {\n        method: \"POST\", headers: { \"Content-Type\": \"application/json\" },\n        body: JSON.stringify({\n          full_name: booking.full_name, email: booking.email, phone: booking.phone,\n          id_type: booking.id_type, id_number: booking.id_number,\n          address: booking.address, city: booking.city, country: booking.country,\n        }),\n      });\n      // Get all customers and find the latest one\n      const customers = await fetch(\"/api/customers\").then(r => r.json());\n      const customerId = customers[0]?.id;\n\n      const bookRes = await fetch(\"/api/bookings\", {\n        method: \"POST\", headers: { \"Content-Type\": \"application/json\" },\n        body: JSON.stringify({\n          customer_id: customerId, room_id: Number(booking.room_id),\n          check_in: booking.check_in, check_out: booking.check_out,\n          guests: booking.guests, special_requests: booking.special_requests,\n        }),\n      });\n      const data = await bookRes.json();\n      setResult(data);\n      setStep(4);\n      notify(\"Booking confirmed successfully!\");\n    } catch (e) {\n      notify(\"Booking failed. Please try again.\", \"error\");\n    }\n    setSubmitting(false);\n  };\n\n  const Field = ({ label, name, type = \"text\", required = false, options, span = 1 }: any) => (\n    <div style={{ gridColumn: `span ${span}` }}>\n      <label style={labelStyle}>{label} {required && <span style={{ color: COLORS.accent }}>*</span>}</label>\n      {options ? (\n        <select value={(booking as any)[name]} onChange={e => setBooking({ ...booking, [name]: e.target.value })}\n          style={inputStyle}>\n          {options.map((o: any) => <option key={o.value ?? o} value={o.value ?? o}>{o.label ?? o}</option>)}\n        </select>\n      ) : (\n        <input type={type} value={(booking as any)[name]}\n          onChange={e => setBooking({ ...booking, [name]: type === \"number\" ? Number(e.target.value) : e.target.value })}\n          style={inputStyle} required={required} />\n      )}\n    </div>\n  );\n\n  return (\n    <div style={{ paddingTop: 72 }}>\n      {/* Header */}\n      <section style={{\n        padding: \"60px 48px\",\n        background: `linear-gradient(135deg, ${COLORS.primary}, ${COLORS.primaryLight})`,\n        textAlign: \"center\", color: \"#fff\",\n      }}>\n        <div style={{ fontSize: 12, letterSpacing: 4, color: COLORS.gold, textTransform: \"uppercase\", fontWeight: 600, marginBottom: 12 }}>Reservation</div>\n        <h1 style={{ fontFamily: FONTS.heading, fontSize: 48 }}>Book Your <span style={{ color: COLORS.gold }}>Stay</span></h1>\n      </section>\n\n      <section style={{ padding: \"48px\", background: COLORS.offWhite, minHeight: \"60vh\" }}>\n        <div style={{ maxWidth: 900, margin: \"0 auto\" }}>\n          {/* Progress */}\n          <div style={{ display: \"flex\", justifyContent: \"center\", gap: 8, marginBottom: 40 }}>\n            {[\"Select Room\", \"Guest Details\", \"Review & Pay\", \"Confirmation\"].map((s, i) => (\n              <div key={i} style={{ display: \"flex\", alignItems: \"center\", gap: 8 }}>\n                <div style={{\n                  width: 32, height: 32, borderRadius: \"50%\", display: \"flex\", alignItems: \"center\", justifyContent: \"center\",\n                  background: step > i + 1 ? COLORS.success : step === i + 1 ? COLORS.accent : \"#ddd\",\n                  color: \"#fff\", fontWeight: 700, fontSize: 13,\n                }}>{step > i + 1 ? \"✓\" : i + 1}</div>\n                <span style={{ fontSize: 13, fontWeight: step === i + 1 ? 700 : 400, color: step === i + 1 ? COLORS.accent : COLORS.gray }}>{s}</span>\n                {i < 3 && <div style={{ width: 40, height: 2, background: step > i + 1 ? COLORS.success : \"#ddd\" }} />}\n              </div>\n            ))}\n          </div>\n\n          {/* Step 1: Room Selection */}\n          {step === 1 && (\n            <div style={cardStyle}>\n              <h3 style={{ fontFamily: FONTS.heading, fontSize: 24, marginBottom: 24 }}>Select Your Room</h3>\n              <div style={{ display: \"grid\", gap: 20, marginBottom: 24 }}>\n                <div style={{ display: \"grid\", gridTemplateColumns: \"1fr 1fr\", gap: 16 }}>\n                  <Field label=\"Check-in Date\" name=\"check_in\" type=\"date\" required />\n                  <Field label=\"Check-out Date\" name=\"check_out\" type=\"date\" required />\n                </div>\n                <Field label=\"Number of Guests\" name=\"guests\" type=\"number\" />\n              </div>\n              <div style={{ display: \"grid\", gap: 12 }}>\n                {rooms.map(room => (\n                  <label key={room.id} style={{\n                    display: \"flex\", alignItems: \"center\", gap: 16, padding: 16, borderRadius: 12,\n                    border: booking.room_id === String(room.id) ? `2px solid ${COLORS.accent}` : \"1px solid #eee\",\n                    background: booking.room_id === String(room.id) ? \"rgba(233,69,96,0.04)\" : \"#fff\",\n                    cursor: \"pointer\", transition: \"all 0.2s\",\n                  }}>\n                    <input type=\"radio\" name=\"room\" value={room.id}\n                      checked={booking.room_id === String(room.id)}\n                      onChange={() => setBooking({ ...booking, room_id: String(room.id) })} />\n                    <span style={{ fontSize: 28 }}>{room.room_type === \"Suite\" ? \"👑\" : room.room_type === \"Deluxe\" ? \"🌟\" : \"🛏️\"}</span>\n                    <div style={{ flex: 1 }}>\n                      <div style={{ fontWeight: 600, fontSize: 16 }}>Room {room.room_number} — {room.room_type}</div>\n                      <div style={{ fontSize: 13, color: COLORS.gray }}>{room.ac_type} • Floor {room.floor} • Max {room.max_guests} guests</div>\n                    </div>\n                    <div style={{ fontFamily: FONTS.heading, fontSize: 22, fontWeight: 700, color: COLORS.accent }}>\n                      ₹{room.price_per_night.toLocaleString()}<span style={{ fontSize: 12, color: COLORS.gray }}>/night</span>\n                    </div>\n                  </label>\n                ))}\n              </div>\n              <div style={{ display: \"flex\", justifyContent: \"flex-end\", marginTop: 24 }}>\n                <button onClick={() => {\n                  if (!booking.room_id || !booking.check_in || !booking.check_out) { notify(\"Select a room and dates\", \"error\"); return; }\n                  if (nights <= 0) { notify(\"Invalid dates\", \"error\"); return; }\n                  setStep(2);\n                }} style={{ ...btnPrimary, borderRadius: 10 }}>Continue →</button>\n              </div>\n            </div>\n          )}\n\n          {/* Step 2: Guest Details */}\n          {step === 2 && (\n            <div style={cardStyle}>\n              <h3 style={{ fontFamily: FONTS.heading, fontSize: 24, marginBottom: 24 }}>Guest Information</h3>\n              <div style={{ display: \"grid\", gridTemplateColumns: \"1fr 1fr\", gap: 16 }}>\n                <Field label=\"Full Name\" name=\"full_name\" required />\n                <Field label=\"Phone Number\" name=\"phone\" required />\n                <Field label=\"Email\" name=\"email\" type=\"email\" />\n                <Field label=\"ID Type\" name=\"id_type\" options={[\"Aadhar\", \"Passport\", \"Driving License\", \"Voter ID\"]} />\n                <Field label=\"ID Number\" name=\"id_number\" />\n                <Field label=\"City\" name=\"city\" />\n                <Field label=\"Address\" name=\"address\" span={2} />\n                <Field label=\"Special Requests\" name=\"special_requests\" span={2} />\n              </div>\n              <div style={{ display: \"flex\", justifyContent: \"space-between\", marginTop: 24 }}>\n                <button onClick={() => setStep(1)} style={{ ...btnPrimary, background: COLORS.gray, borderRadius: 10 }}>← Back</button>\n                <button onClick={() => {\n                  if (!booking.full_name || !booking.phone) { notify(\"Name and phone are required\", \"error\"); return; }\n                  setStep(3);\n                }} style={{ ...btnPrimary, borderRadius: 10 }}>Review Booking →</button>\n              </div>\n            </div>\n          )}\n\n          {/* Step 3: Review */}\n          {step === 3 && (\n            <div style={cardStyle}>\n              <h3 style={{ fontFamily: FONTS.heading, fontSize: 24, marginBottom: 24 }}>Review Your Booking</h3>\n              <div style={{ display: \"grid\", gridTemplateColumns: \"1fr 1fr\", gap: 32 }}>\n                <div>\n                  <h4 style={{ fontSize: 14, color: COLORS.gray, textTransform: \"uppercase\", letterSpacing: 1, marginBottom: 16 }}>Guest Details</h4>\n                  <div style={{ lineHeight: 2, fontSize: 15 }}>\n                    <div><strong>Name:</strong> {booking.full_name}</div>\n                    <div><strong>Phone:</strong> {booking.phone}</div>\n                    <div><strong>Email:</strong> {booking.email || \"—\"}</div>\n                    <div><strong>ID:</strong> {booking.id_type} — {booking.id_number || \"—\"}</div>\n                  </div>\n                </div>\n                <div>\n                  <h4 style={{ fontSize: 14, color: COLORS.gray, textTransform: \"uppercase\", letterSpacing: 1, marginBottom: 16 }}>Booking Details</h4>\n                  <div style={{ lineHeight: 2, fontSize: 15 }}>\n                    <div><strong>Room:</strong> {selectedRoom?.room_number} — {selectedRoom?.room_type}</div>\n                    <div><strong>Check-in:</strong> {booking.check_in}</div>\n                    <div><strong>Check-out:</strong> {booking.check_out}</div>\n                    <div><strong>Nights:</strong> {nights}</div>\n                    <div><strong>Guests:</strong> {booking.guests}</div>\n                  </div>\n                </div>\n              </div>\n              {/* Bill */}\n              <div style={{ marginTop: 32, padding: 24, background: COLORS.offWhite, borderRadius: 12 }}>\n                <h4 style={{ fontFamily: FONTS.heading, fontSize: 20, marginBottom: 16 }}>💰 Bill Summary</h4>\n                <div style={{ display: \"flex\", justifyContent: \"space-between\", padding: \"8px 0\", borderBottom: \"1px solid #e0e0e0\" }}>\n                  <span>Room Charges ({nights} nights × ₹{selectedRoom?.price_per_night.toLocaleString()})</span>\n                  <span style={{ fontWeight: 600 }}>₹{total.toLocaleString()}</span>\n                </div>\n                <div style={{ display: \"flex\", justifyContent: \"space-between\", padding: \"8px 0\", borderBottom: \"1px solid #e0e0e0\" }}>\n                  <span>GST (18%)</span>\n                  <span style={{ fontWeight: 600 }}>₹{tax.toLocaleString()}</span>\n                </div>\n                <div style={{ display: \"flex\", justifyContent: \"space-between\", padding: \"12px 0\", fontSize: 20, fontWeight: 700, color: COLORS.accent }}>\n                  <span>Grand Total</span>\n                  <span>₹{(total + tax).toLocaleString()}</span>\n                </div>\n              </div>\n              <div style={{ display: \"flex\", justifyContent: \"space-between\", marginTop: 24 }}>\n                <button onClick={() => setStep(2)} style={{ ...btnPrimary, background: COLORS.gray, borderRadius: 10 }}>← Back</button>\n                <button onClick={handleSubmit} disabled={submitting} style={{ ...btnPrimary, borderRadius: 10, opacity: submitting ? 0.6 : 1 }}>\n                  {submitting ? \"Processing...\" : \"✓ Confirm Booking\"}\n                </button>\n              </div>\n            </div>\n          )}\n\n          {/* Step 4: Confirmation */}\n          {step === 4 && result && (\n            <div style={{ ...cardStyle, textAlign: \"center\", padding: 48 }}>\n              <div style={{ fontSize: 64, marginBottom: 16 }}>🎉</div>\n              <h2 style={{ fontFamily: FONTS.heading, fontSize: 32, color: COLORS.success, marginBottom: 12 }}>Booking Confirmed!</h2>\n              <p style={{ fontSize: 16, color: COLORS.gray, marginBottom: 32 }}>Your reservation has been successfully processed.</p>\n              <div style={{ background: COLORS.offWhite, borderRadius: 12, padding: 24, display: \"inline-block\", textAlign: \"left\" }}>\n                <div style={{ fontSize: 14, lineHeight: 2.2 }}>\n                  <div><strong>Booking Reference:</strong> <span style={{ color: COLORS.accent, fontSize: 18, fontWeight: 700 }}>{result.booking_ref}</span></div>\n                  <div><strong>Room Charges:</strong> ₹{result.total_amount?.toLocaleString()}</div>\n                  <div><strong>Tax (GST 18%):</strong> ₹{result.tax_amount?.toLocaleString()}</div>\n                  <div><strong>Grand Total:</strong> <span style={{ fontSize: 20, fontWeight: 700, color: COLORS.accent }}>₹{result.grand_total?.toLocaleString()}</span></div>\n                  <div><strong>Duration:</strong> {result.nights} night(s)</div>\n                </div>\n              </div>\n              <div style={{ marginTop: 32, display: \"flex\", justifyContent: \"center\", gap: 16 }}>\n                <button onClick={() => window.print()} style={{ ...btnPrimary, background: COLORS.success, borderRadius: 10 }}>🖨️ Print Confirmation</button>\n                <button onClick={() => { setStep(1); setBooking({ ...booking, full_name: \"\", phone: \"\", email: \"\", room_id: \"\" }); setResult(null); }}\n                  style={{ ...btnPrimary, borderRadius: 10 }}>📝 New Booking</button>\n              </div>\n            </div>\n          )}\n        </div>\n      </section>\n    </div>\n  );\n}\n",[],[151,226,240],"128815fe-5478-11f1-af3e-ee650bb23af1","AboutPage.tsx","128816da-5478-11f1-af3e-ee650bb23af1",13,["D",1779301010882],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { COLORS, FONTS } from \"../styles.ts\";\n\nexport function AboutPage() {\n  return (\n    <div style={{ paddingTop: 72 }}>\n      {/* Hero */}\n      <section style={{\n        padding: \"80px 48px\",\n        background: `linear-gradient(135deg, ${COLORS.primary}, ${COLORS.primaryLight})`,\n        textAlign: \"center\", color: \"#fff\",\n      }}>\n        <div style={{ fontSize: 12, letterSpacing: 4, color: COLORS.gold, textTransform: \"uppercase\", fontWeight: 600, marginBottom: 12 }}>Our Story</div>\n        <h1 style={{ fontFamily: FONTS.heading, fontSize: 48 }}>About <span style={{ color: COLORS.gold }}>Grand Palace</span></h1>\n        <p style={{ color: \"rgba(255,255,255,0.6)\", fontSize: 17, maxWidth: 600, margin: \"16px auto 0\" }}>\n          A legacy of luxury hospitality spanning over 15 years of excellence.\n        </p>\n      </section>\n\n      {/* Story */}\n      <section style={{ padding: \"80px 48px\", background: \"#fff\" }}>\n        <div style={{ maxWidth: 1000, margin: \"0 auto\", display: \"grid\", gridTemplateColumns: \"1fr 1fr\", gap: 60, alignItems: \"center\" }}>\n          <div>\n            <div style={{ fontSize: 12, letterSpacing: 4, color: COLORS.gold, textTransform: \"uppercase\", fontWeight: 600, marginBottom: 12 }}>Established 2009</div>\n            <h2 style={{ fontFamily: FONTS.heading, fontSize: 36, color: COLORS.primary, marginBottom: 20 }}>Where Tradition Meets Modern Luxury</h2>\n            <p style={{ color: COLORS.gray, lineHeight: 1.8, fontSize: 15, marginBottom: 16 }}>\n              Grand Palace Hotels & Resorts was founded with a vision to redefine hospitality in India. \n              What started as a boutique property has grown into one of the country's most respected luxury hotel chains.\n            </p>\n            <p style={{ color: COLORS.gray, lineHeight: 1.8, fontSize: 15 }}>\n              Our commitment to excellence, personalized service, and attention to every detail has earned us \n              numerous accolades and the loyalty of guests from around the world.\n            </p>\n          </div>\n          <div style={{\n            height: 400, borderRadius: 20,\n            background: `linear-gradient(135deg, ${COLORS.gold}33, ${COLORS.accent}22)`,\n            display: \"flex\", alignItems: \"center\", justifyContent: \"center\",\n            boxShadow: \"0 20px 60px rgba(0,0,0,0.1)\",\n          }}>\n            <span style={{ fontSize: 120 }}>🏨</span>\n          </div>\n        </div>\n      </section>\n\n      {/* Values */}\n      <section style={{ padding: \"80px 48px\", background: COLORS.offWhite }}>\n        <div style={{ maxWidth: 1000, margin: \"0 auto\", textAlign: \"center\" }}>\n          <h2 style={{ fontFamily: FONTS.heading, fontSize: 36, color: COLORS.primary, marginBottom: 48 }}>Our Core Values</h2>\n          <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(3, 1fr)\", gap: 32 }}>\n            {[\n              { icon: \"🌟\", title: \"Excellence\", desc: \"We pursue perfection in every detail, from room décor to guest interactions.\" },\n              { icon: \"🤝\", title: \"Hospitality\", desc: \"Warmth, care, and genuine connection define every guest experience.\" },\n              { icon: \"🌱\", title: \"Sustainability\", desc: \"We are committed to eco-friendly practices and responsible tourism.\" },\n            ].map((v, i) => (\n              <div key={i} style={{ background: \"#fff\", borderRadius: 16, padding: 36, boxShadow: \"0 2px 12px rgba(0,0,0,0.04)\" }}>\n                <div style={{ fontSize: 48, marginBottom: 20 }}>{v.icon}</div>\n                <h3 style={{ fontFamily: FONTS.heading, fontSize: 22, marginBottom: 12, color: COLORS.primary }}>{v.title}</h3>\n                <p style={{ fontSize: 14, color: COLORS.gray, lineHeight: 1.7 }}>{v.desc}</p>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n\n      {/* Team */}\n      <section style={{ padding: \"80px 48px\", background: \"#fff\" }}>\n        <div style={{ maxWidth: 1000, margin: \"0 auto\", textAlign: \"center\" }}>\n          <h2 style={{ fontFamily: FONTS.heading, fontSize: 36, color: COLORS.primary, marginBottom: 48 }}>Leadership Team</h2>\n          <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(4, 1fr)\", gap: 28 }}>\n            {[\n              { name: \"Arjun Mehta\", role: \"CEO & Founder\", icon: \"👨‍💼\" },\n              { name: \"Kavita Sharma\", role: \"General Manager\", icon: \"👩‍💼\" },\n              { name: \"Chef Rajan\", role: \"Executive Chef\", icon: \"👨‍🍳\" },\n              { name: \"Dr. Anita Rao\", role: \"Spa Director\", icon: \"👩‍⚕️\" },\n            ].map((m, i) => (\n              <div key={i}>\n                <div style={{\n                  width: 100, height: 100, borderRadius: \"50%\", margin: \"0 auto 16px\",\n                  background: `linear-gradient(135deg, ${COLORS.accent}, ${COLORS.gold})`,\n                  display: \"flex\", alignItems: \"center\", justifyContent: \"center\", fontSize: 40,\n                }}>{m.icon}</div>\n                <div style={{ fontWeight: 700, fontSize: 16, marginBottom: 4 }}>{m.name}</div>\n                <div style={{ fontSize: 13, color: COLORS.gold, fontWeight: 600 }}>{m.role}</div>\n              </div>\n            ))}\n          </div>\n        </div>\n      </section>\n    </div>\n  );\n}\n",[],[151,226,248],"d648c8fe-5477-11f1-8ca8-ee650bb23af1",["D",1779300909794],[190,191,192,193,194],[151,226],"a215a692-5477-11f1-9426-ee650bb23af1","Navbar.tsx","a215a782-5477-11f1-9426-ee650bb23af1","a85d1dd8-17bd-4c46-8168-7391df1299df",7,["D",1779300822213],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Page, User } from \"../App.tsx\";\nimport { COLORS, FONTS } from \"../styles.ts\";\n\ninterface Props {\n  page: Page;\n  setPage: (p: Page) => void;\n  user: User | null;\n  onLogout: () => void;\n}\n\nexport function Navbar({ page, setPage, user, onLogout }: Props) {\n  const [scrolled, setScrolled] = useState(false);\n\n  if (typeof window !== \"undefined\") {\n    window.addEventListener(\"scroll\", () => setScrolled(window.scrollY > 50));\n  }\n\n  const isHome = page === \"home\";\n  const navBg = isHome && !scrolled ? \"transparent\" : COLORS.primary;\n  const links: { label: string; p: Page }[] = [\n    { label: \"Home\", p: \"home\" },\n    { label: \"Rooms\", p: \"rooms\" },\n    { label: \"Book Now\", p: \"booking\" },\n    { label: \"About\", p: \"about\" },\n    { label: \"Contact\", p: \"contact\" },\n  ];\n\n  return (\n    <nav style={{\n      position: isHome ? \"fixed\" : \"sticky\",\n      top: 0, left: 0, right: 0, zIndex: 1000,\n      background: navBg,\n      padding: \"0 48px\",\n      display: \"flex\", alignItems: \"center\", justifyContent: \"space-between\",\n      height: 72,\n      transition: \"all 0.3s\",\n      boxShadow: scrolled ? \"0 2px 20px rgba(0,0,0,0.15)\" : \"none\",\n      backdropFilter: isHome && !scrolled ? \"blur(10px)\" : \"none\",\n    }}>\n      {/* Logo */}\n      <div onClick={() => setPage(\"home\")} style={{ cursor: \"pointer\", display: \"flex\", alignItems: \"center\", gap: 12 }}>\n        <span style={{ fontSize: 28, color: COLORS.gold }}>🏨</span>\n        <div>\n          <div style={{ fontFamily: FONTS.heading, fontSize: 22, fontWeight: 700, color: COLORS.gold, lineHeight: 1.1 }}>\n            Grand Palace\n          </div>\n          <div style={{ fontSize: 10, color: \"rgba(255,255,255,0.7)\", letterSpacing: 3, textTransform: \"uppercase\" }}>\n            Hotels & Resorts\n          </div>\n        </div>\n      </div>\n\n      {/* Links */}\n      <div style={{ display: \"flex\", gap: 8, alignItems: \"center\" }}>\n        {links.map((l) => (\n          <button\n            key={l.p}\n            onClick={() => setPage(l.p)}\n            style={{\n              background: page === l.p ? \"rgba(228,169,96,0.15)\" : \"transparent\",\n              color: page === l.p ? COLORS.gold : \"#fff\",\n              border: \"none\",\n              padding: \"8px 18px\",\n              borderRadius: 8,\n              fontSize: 14,\n              fontWeight: page === l.p ? 700 : 500,\n              cursor: \"pointer\",\n              fontFamily: FONTS.body,\n              transition: \"all 0.2s\",\n            }}\n          >\n            {l.label}\n          </button>\n        ))}\n        <div style={{ width: 1, height: 24, background: \"rgba(255,255,255,0.2)\", margin: \"0 8px\" }} />\n        {user ? (\n          <div style={{ display: \"flex\", alignItems: \"center\", gap: 10 }}>\n            <button onClick={() => setPage(\"admin-dashboard\")} style={{\n              background: `linear-gradient(135deg, ${COLORS.gold}, ${COLORS.goldLight})`,\n              color: COLORS.primary, border: \"none\", padding: \"8px 20px\", borderRadius: 8,\n              fontWeight: 700, fontSize: 13, cursor: \"pointer\", fontFamily: FONTS.body,\n            }}>\n              ⚙ Dashboard\n            </button>\n            <button onClick={onLogout} style={{\n              background: \"rgba(255,255,255,0.1)\", color: \"#fff\", border: \"1px solid rgba(255,255,255,0.2)\",\n              padding: \"8px 16px\", borderRadius: 8, fontSize: 13, cursor: \"pointer\", fontFamily: FONTS.body,\n            }}>\n              Logout\n            </button>\n          </div>\n        ) : (\n          <button onClick={() => setPage(\"login\")} style={{\n            background: COLORS.accent, color: \"#fff\", border: \"none\",\n            padding: \"8px 22px\", borderRadius: 8, fontWeight: 600, fontSize: 14,\n            cursor: \"pointer\", fontFamily: FONTS.body, transition: \"all 0.2s\",\n          }}>\n            Staff Login\n          </button>\n        )}\n      </div>\n    </nav>\n  );\n}\n",[],[151,268,260],"components","ab8f8f58-5477-11f1-8ca8-ee650bb23af1","Footer.tsx","ab8f8ff8-5477-11f1-8ca8-ee650bb23af1",8,["D",1779300838126],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport type { Page } from \"../App.tsx\";\nimport { COLORS, FONTS } from \"../styles.ts\";\n\nexport function Footer({ setPage }: { setPage: (p: Page) => void }) {\n  return (\n    <footer style={{ background: COLORS.primary, color: \"#fff\", padding: \"60px 48px 30px\" }}>\n      <div style={{ maxWidth: 1200, margin: \"0 auto\", display: \"grid\", gridTemplateColumns: \"2fr 1fr 1fr 1fr\", gap: 48 }}>\n        {/* Brand */}\n        <div>\n          <div style={{ display: \"flex\", alignItems: \"center\", gap: 10, marginBottom: 16 }}>\n            <span style={{ fontSize: 32 }}>🏨</span>\n            <div>\n              <div style={{ fontFamily: FONTS.heading, fontSize: 24, fontWeight: 700, color: COLORS.gold }}>Grand Palace</div>\n              <div style={{ fontSize: 10, color: \"rgba(255,255,255,0.5)\", letterSpacing: 3, textTransform: \"uppercase\" }}>Hotels & Resorts</div>\n            </div>\n          </div>\n          <p style={{ color: \"rgba(255,255,255,0.6)\", lineHeight: 1.7, fontSize: 14 }}>\n            Experience luxury and comfort at Grand Palace Hotels & Resorts. Where every stay becomes a cherished memory.\n          </p>\n          <div style={{ display: \"flex\", gap: 12, marginTop: 20 }}>\n            {[\"📘\", \"🐦\", \"📸\", \"🔗\"].map((icon, i) => (\n              <span key={i} style={{\n                width: 36, height: 36, borderRadius: \"50%\", background: \"rgba(255,255,255,0.1)\",\n                display: \"flex\", alignItems: \"center\", justifyContent: \"center\", fontSize: 16, cursor: \"pointer\",\n              }}>{icon}</span>\n            ))}\n          </div>\n        </div>\n\n        {/* Quick Links */}\n        <div>\n          <h4 style={{ fontFamily: FONTS.heading, fontSize: 18, marginBottom: 20, color: COLORS.gold }}>Quick Links</h4>\n          {([\"home\", \"rooms\", \"booking\", \"about\", \"contact\"] as Page[]).map((p) => (\n            <div key={p} onClick={() => setPage(p)} style={{\n              color: \"rgba(255,255,255,0.6)\", cursor: \"pointer\", padding: \"6px 0\", fontSize: 14,\n              transition: \"color 0.2s\", textTransform: \"capitalize\",\n            }}>{p}</div>\n          ))}\n        </div>\n\n        {/* Services */}\n        <div>\n          <h4 style={{ fontFamily: FONTS.heading, fontSize: 18, marginBottom: 20, color: COLORS.gold }}>Services</h4>\n          {[\"Room Service\", \"Spa & Wellness\", \"Fine Dining\", \"Conference Hall\", \"Airport Transfer\"].map((s) => (\n            <div key={s} style={{ color: \"rgba(255,255,255,0.6)\", padding: \"6px 0\", fontSize: 14 }}>{s}</div>\n          ))}\n        </div>\n\n        {/* Contact */}\n        <div>\n          <h4 style={{ fontFamily: FONTS.heading, fontSize: 18, marginBottom: 20, color: COLORS.gold }}>Contact Us</h4>\n          <div style={{ color: \"rgba(255,255,255,0.6)\", fontSize: 14, lineHeight: 2 }}>\n            📍 123 Luxury Lane, Mumbai, India<br />\n            📞 +91 98765 43210<br />\n            ✉️ info@grandpalace.com<br />\n            🕐 24/7 Front Desk\n          </div>\n        </div>\n      </div>\n\n      <div style={{ maxWidth: 1200, margin: \"40px auto 0\", borderTop: \"1px solid rgba(255,255,255,0.1)\", paddingTop: 24, display: \"flex\", justifyContent: \"space-between\", alignItems: \"center\" }}>\n        <div style={{ color: \"rgba(255,255,255,0.4)\", fontSize: 13 }}>© 2024 Grand Palace Hotels & Resorts. All rights reserved.</div>\n        <div style={{ display: \"flex\", gap: 20, fontSize: 13, color: \"rgba(255,255,255,0.4)\" }}>\n          <span style={{ cursor: \"pointer\" }}>Privacy Policy</span>\n          <span style={{ cursor: \"pointer\" }}>Terms of Service</span>\n        </div>\n      </div>\n    </footer>\n  );\n}\n",[],[151,268,270],"b6f4f892-5477-11f1-b3b0-ee650bb23af1","AdminSidebar.tsx","b6f4f93c-5477-11f1-b3b0-ee650bb23af1",9,["D",1779300857243],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport type { Page, User } from \"../App.tsx\";\nimport { COLORS, FONTS } from \"../styles.ts\";\n\ninterface Props {\n  page: Page;\n  setPage: (p: Page) => void;\n  user: User;\n  onLogout: () => void;\n}\n\nconst menuItems: { icon: string; label: string; page: Page }[] = [\n  { icon: \"📊\", label: \"Dashboard\", page: \"admin-dashboard\" },\n  { icon: \"🛏️\", label: \"Rooms\", page: \"admin-rooms\" },\n  { icon: \"👤\", label: \"Customers\", page: \"admin-customers\" },\n  { icon: \"📋\", label: \"Bookings\", page: \"admin-bookings\" },\n  { icon: \"👥\", label: \"Employees\", page: \"admin-employees\" },\n  { icon: \"💳\", label: \"Payments\", page: \"admin-payments\" },\n  { icon: \"⭐\", label: \"Feedback\", page: \"admin-feedback\" },\n];\n\nexport function AdminSidebar({ page, setPage, user, onLogout }: Props) {\n  return (\n    <div style={{\n      width: 260, background: COLORS.primary, color: \"#fff\",\n      display: \"flex\", flexDirection: \"column\", minHeight: \"100vh\",\n    }}>\n      {/* Logo */}\n      <div style={{ padding: \"24px 20px\", borderBottom: \"1px solid rgba(255,255,255,0.08)\" }}>\n        <div onClick={() => setPage(\"home\")} style={{ cursor: \"pointer\", display: \"flex\", alignItems: \"center\", gap: 10 }}>\n          <span style={{ fontSize: 24 }}>🏨</span>\n          <div>\n            <div style={{ fontFamily: FONTS.heading, fontSize: 18, fontWeight: 700, color: COLORS.gold }}>Grand Palace</div>\n            <div style={{ fontSize: 9, color: \"rgba(255,255,255,0.4)\", letterSpacing: 2, textTransform: \"uppercase\" }}>Admin Panel</div>\n          </div>\n        </div>\n      </div>\n\n      {/* User Info */}\n      <div style={{ padding: \"20px\", borderBottom: \"1px solid rgba(255,255,255,0.08)\" }}>\n        <div style={{ display: \"flex\", alignItems: \"center\", gap: 12 }}>\n          <div style={{\n            width: 40, height: 40, borderRadius: \"50%\",\n            background: `linear-gradient(135deg, ${COLORS.accent}, ${COLORS.gold})`,\n            display: \"flex\", alignItems: \"center\", justifyContent: \"center\",\n            fontSize: 18, fontWeight: 700,\n          }}>\n            {user.full_name.charAt(0)}\n          </div>\n          <div>\n            <div style={{ fontSize: 14, fontWeight: 600 }}>{user.full_name}</div>\n            <div style={{\n              fontSize: 11, color: COLORS.gold, textTransform: \"capitalize\",\n              background: \"rgba(212,168,83,0.15)\", padding: \"2px 8px\", borderRadius: 4, display: \"inline-block\",\n            }}>{user.role}</div>\n          </div>\n        </div>\n      </div>\n\n      {/* Menu */}\n      <div style={{ flex: 1, padding: \"16px 12px\" }}>\n        <div style={{ fontSize: 10, color: \"rgba(255,255,255,0.3)\", fontWeight: 700, padding: \"8px 12px\", letterSpacing: 2, textTransform: \"uppercase\" }}>\n          Main Menu\n        </div>\n        {menuItems.map((item) => (\n          <button\n            key={item.page}\n            onClick={() => setPage(item.page)}\n            style={{\n              display: \"flex\", alignItems: \"center\", gap: 12, width: \"100%\",\n              padding: \"12px 16px\", borderRadius: 10,\n              background: page === item.page ? \"rgba(233,69,96,0.15)\" : \"transparent\",\n              color: page === item.page ? COLORS.accent : \"rgba(255,255,255,0.7)\",\n              border: page === item.page ? `1px solid rgba(233,69,96,0.3)` : \"1px solid transparent\",\n              fontSize: 14, fontWeight: page === item.page ? 600 : 400,\n              cursor: \"pointer\", transition: \"all 0.2s\", fontFamily: FONTS.body,\n              marginBottom: 4,\n            }}\n          >\n            <span style={{ fontSize: 18 }}>{item.icon}</span>\n            {item.label}\n          </button>\n        ))}\n      </div>\n\n      {/* Back to Website + Logout */}\n      <div style={{ padding: \"16px 12px\", borderTop: \"1px solid rgba(255,255,255,0.08)\" }}>\n        <button onClick={() => setPage(\"home\")} style={{\n          display: \"flex\", alignItems: \"center\", gap: 10, width: \"100%\",\n          padding: \"10px 16px\", borderRadius: 8, background: \"rgba(255,255,255,0.05)\",\n          color: \"rgba(255,255,255,0.6)\", border: \"none\", fontSize: 13, cursor: \"pointer\",\n          fontFamily: FONTS.body, marginBottom: 8,\n        }}>\n          🌐 Back to Website\n        </button>\n        <button onClick={onLogout} style={{\n          display: \"flex\", alignItems: \"center\", gap: 10, width: \"100%\",\n          padding: \"10px 16px\", borderRadius: 8, background: \"rgba(239,68,68,0.1)\",\n          color: COLORS.danger, border: \"none\", fontSize: 13, cursor: \"pointer\",\n          fontFamily: FONTS.body, fontWeight: 600,\n        }}>\n          🚪 Logout\n        </button>\n      </div>\n    </div>\n  );\n}\n",[],[151,268,278],"a215d1da-5477-11f1-9426-ee650bb23af1",["D",1779300822213],[186,187,188],[151,268],["D",1779300789627],[185,189,195,196],[151],"e9b7b0e0-5476-11f1-8c7b-ee650bb23af1","schema.ts","e9b7b1a8-5476-11f1-8c7b-ee650bb23af1",["D",1779300512907],"// Database schema initialization for the Hotel Management System\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport async function initDatabase() {\n  await sqlite.batch([\n    // Users table (admin, receptionist)\n    {\n      sql: `CREATE TABLE IF NOT EXISTS users (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        username TEXT UNIQUE NOT NULL,\n        password TEXT NOT NULL,\n        full_name TEXT NOT NULL,\n        email TEXT,\n        role TEXT NOT NULL DEFAULT 'receptionist',\n        created_at TEXT DEFAULT (datetime('now'))\n      )`,\n      args: [],\n    },\n    // Rooms table\n    {\n      sql: `CREATE TABLE IF NOT EXISTS rooms (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        room_number TEXT UNIQUE NOT NULL,\n        room_type TEXT NOT NULL DEFAULT 'Standard',\n        ac_type TEXT NOT NULL DEFAULT 'AC',\n        price_per_night REAL NOT NULL,\n        status TEXT NOT NULL DEFAULT 'available',\n        description TEXT,\n        image_url TEXT,\n        max_guests INTEGER DEFAULT 2,\n        floor INTEGER DEFAULT 1,\n        created_at TEXT DEFAULT (datetime('now'))\n      )`,\n      args: [],\n    },\n    // Customers table\n    {\n      sql: `CREATE TABLE IF NOT EXISTS customers (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        full_name TEXT NOT NULL,\n        email TEXT,\n        phone TEXT NOT NULL,\n        id_type TEXT DEFAULT 'Aadhar',\n        id_number TEXT,\n        address TEXT,\n        city TEXT,\n        country TEXT DEFAULT 'India',\n        created_at TEXT DEFAULT (datetime('now'))\n      )`,\n      args: [],\n    },\n    // Bookings table\n    {\n      sql: `CREATE TABLE IF NOT EXISTS bookings (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        booking_ref TEXT UNIQUE NOT NULL,\n        customer_id INTEGER NOT NULL,\n        room_id INTEGER NOT NULL,\n        check_in TEXT NOT NULL,\n        check_out TEXT NOT NULL,\n        guests INTEGER DEFAULT 1,\n        status TEXT NOT NULL DEFAULT 'confirmed',\n        total_amount REAL NOT NULL,\n        tax_amount REAL DEFAULT 0,\n        grand_total REAL NOT NULL,\n        payment_status TEXT DEFAULT 'pending',\n        special_requests TEXT,\n        created_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY (customer_id) REFERENCES customers(id),\n        FOREIGN KEY (room_id) REFERENCES rooms(id)\n      )`,\n      args: [],\n    },\n    // Employees table\n    {\n      sql: `CREATE TABLE IF NOT EXISTS employees (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        full_name TEXT NOT NULL,\n        email TEXT,\n        phone TEXT,\n        role TEXT NOT NULL,\n        department TEXT,\n        salary REAL,\n        join_date TEXT,\n        status TEXT DEFAULT 'active',\n        created_at TEXT DEFAULT (datetime('now'))\n      )`,\n      args: [],\n    },\n    // Payments table\n    {\n      sql: `CREATE TABLE IF NOT EXISTS payments (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        booking_id INTEGER NOT NULL,\n        amount REAL NOT NULL,\n        payment_method TEXT DEFAULT 'cash',\n        payment_date TEXT DEFAULT (datetime('now')),\n        status TEXT DEFAULT 'completed',\n        transaction_id TEXT,\n        FOREIGN KEY (booking_id) REFERENCES bookings(id)\n      )`,\n      args: [],\n    },\n    // Feedback table\n    {\n      sql: `CREATE TABLE IF NOT EXISTS feedback (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        booking_id INTEGER,\n        customer_name TEXT NOT NULL,\n        email TEXT,\n        rating INTEGER NOT NULL,\n        comment TEXT,\n        created_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY (booking_id) REFERENCES bookings(id)\n      )`,\n      args: [],\n    },\n  ]);\n}\n\nexport async function seedData() {\n  // Check if data exists\n  const userCount = await sqlite.execute(\"SELECT COUNT(*) as count FROM users\");\n  if ((userCount.rows[0] as any).count > 0) return;\n\n  await sqlite.batch([\n    // Default admin user (password: admin123)\n    {\n      sql: `INSERT INTO users (username, password, full_name, email, role) VALUES (?, ?, ?, ?, ?)`,\n      args: [\"admin\", \"admin123\", \"System Administrator\", \"admin@grandpalace.com\", \"admin\"],\n    },\n    {\n      sql: `INSERT INTO users (username, password, full_name, email, role) VALUES (?, ?, ?, ?, ?)`,\n      args: [\"reception\", \"reception123\", \"Front Desk\", \"reception@grandpalace.com\", \"receptionist\"],\n    },\n    // Sample rooms\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"101\", \"Standard\", \"AC\", 2500, \"available\", \"Comfortable standard room with city view, queen bed, and modern amenities.\", 2, 1],\n    },\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"102\", \"Standard\", \"Non-AC\", 1800, \"available\", \"Budget-friendly room with garden view and essential amenities.\", 2, 1],\n    },\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"201\", \"Deluxe\", \"AC\", 4500, \"available\", \"Spacious deluxe room with panoramic view, king bed, mini bar, and luxury bath.\", 3, 2],\n    },\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"202\", \"Deluxe\", \"AC\", 4500, \"booked\", \"Premium deluxe room with balcony, king bed, and complimentary breakfast.\", 3, 2],\n    },\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"301\", \"Suite\", \"AC\", 8500, \"available\", \"Luxurious suite with living area, jacuzzi, and butler service.\", 4, 3],\n    },\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"302\", \"Suite\", \"AC\", 12000, \"available\", \"Presidential suite with private terrace, dining room, and premium amenities.\", 4, 3],\n    },\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"103\", \"Standard\", \"AC\", 2800, \"maintenance\", \"Standard room currently under renovation.\", 2, 1],\n    },\n    {\n      sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"203\", \"Deluxe\", \"AC\", 5000, \"available\", \"Corner deluxe room with dual views and premium furnishing.\", 3, 2],\n    },\n    // Sample customers\n    {\n      sql: `INSERT INTO customers (full_name, email, phone, id_type, id_number, address, city, country) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"Rajesh Kumar\", \"rajesh@email.com\", \"9876543210\", \"Aadhar\", \"1234-5678-9012\", \"123 MG Road\", \"Mumbai\", \"India\"],\n    },\n    {\n      sql: `INSERT INTO customers (full_name, email, phone, id_type, id_number, address, city, country) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"Priya Sharma\", \"priya@email.com\", \"9876543211\", \"Passport\", \"K1234567\", \"456 Park Street\", \"Delhi\", \"India\"],\n    },\n    {\n      sql: `INSERT INTO customers (full_name, email, phone, id_type, id_number, address, city, country) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"John Smith\", \"john@email.com\", \"9876543212\", \"Passport\", \"US123456\", \"789 Broadway\", \"New York\", \"USA\"],\n    },\n    // Sample bookings\n    {\n      sql: `INSERT INTO bookings (booking_ref, customer_id, room_id, check_in, check_out, guests, status, total_amount, tax_amount, grand_total, payment_status) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"BK-2024-001\", 1, 4, \"2024-12-20\", \"2024-12-23\", 2, \"checked_in\", 13500, 2430, 15930, \"paid\"],\n    },\n    {\n      sql: `INSERT INTO bookings (booking_ref, customer_id, room_id, check_in, check_out, guests, status, total_amount, tax_amount, grand_total, payment_status) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"BK-2024-002\", 2, 5, \"2024-12-25\", \"2024-12-28\", 2, \"confirmed\", 25500, 4590, 30090, \"pending\"],\n    },\n    {\n      sql: `INSERT INTO bookings (booking_ref, customer_id, room_id, check_in, check_out, guests, status, total_amount, tax_amount, grand_total, payment_status) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"BK-2024-003\", 3, 1, \"2024-12-22\", \"2024-12-24\", 1, \"confirmed\", 5000, 900, 5900, \"paid\"],\n    },\n    // Sample employees\n    {\n      sql: `INSERT INTO employees (full_name, email, phone, role, department, salary, join_date, status) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"Amit Patel\", \"amit@grandpalace.com\", \"9876500001\", \"Manager\", \"Management\", 75000, \"2022-01-15\", \"active\"],\n    },\n    {\n      sql: `INSERT INTO employees (full_name, email, phone, role, department, salary, join_date, status) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"Sneha Reddy\", \"sneha@grandpalace.com\", \"9876500002\", \"Receptionist\", \"Front Desk\", 35000, \"2023-03-01\", \"active\"],\n    },\n    {\n      sql: `INSERT INTO employees (full_name, email, phone, role, department, salary, join_date, status) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"Vikram Singh\", \"vikram@grandpalace.com\", \"9876500003\", \"Housekeeping\", \"Operations\", 25000, \"2023-06-15\", \"active\"],\n    },\n    {\n      sql: `INSERT INTO employees (full_name, email, phone, role, department, salary, join_date, status) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [\"Chef Rajan\", \"rajan@grandpalace.com\", \"9876500004\", \"Chef\", \"Restaurant\", 55000, \"2022-08-01\", \"active\"],\n    },\n    // Sample feedback\n    {\n      sql: `INSERT INTO feedback (booking_id, customer_name, email, rating, comment) VALUES (?, ?, ?, ?, ?)`,\n      args: [1, \"Rajesh Kumar\", \"rajesh@email.com\", 5, \"Excellent service and beautiful rooms! Will definitely come back.\"],\n    },\n    {\n      sql: `INSERT INTO feedback (booking_id, customer_name, email, rating, comment) VALUES (?, ?, ?, ?, ?)`,\n      args: [null, \"Anonymous Guest\", \"guest@email.com\", 4, \"Great location and friendly staff. Food could be better.\"],\n    },\n    // Sample payments\n    {\n      sql: `INSERT INTO payments (booking_id, amount, payment_method, status, transaction_id) VALUES (?, ?, ?, ?, ?)`,\n      args: [1, 15930, \"credit_card\", \"completed\", \"TXN-2024-001\"],\n    },\n    {\n      sql: `INSERT INTO payments (booking_id, amount, payment_method, status, transaction_id) VALUES (?, ?, ?, ?, ?)`,\n      args: [3, 5900, \"upi\", \"completed\", \"TXN-2024-003\"],\n    },\n  ]);\n}\n",[],[158,293],"fc2efd96-5476-11f1-bf00-ee650bb23af1","queries.ts","fc2efe36-5476-11f1-bf00-ee650bb23af1",3,["D",1779300543890],"// Database query helpers for the Hotel Management System\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\n// ===== AUTH =====\nexport async function authenticateUser(username: string, password: string) {\n  const result = await sqlite.execute({\n    sql: \"SELECT id, username, full_name, email, role FROM users WHERE username = ? AND password = ?\",\n    args: [username, password],\n  });\n  return result.rows[0] || null;\n}\n\n// ===== DASHBOARD =====\nexport async function getDashboardStats() {\n  const [totalRooms, available, booked, maintenance, totalCustomers, totalBookings, revenue, recentBookings, feedbackStats] = await Promise.all([\n    sqlite.execute(\"SELECT COUNT(*) as count FROM rooms\"),\n    sqlite.execute(\"SELECT COUNT(*) as count FROM rooms WHERE status = 'available'\"),\n    sqlite.execute(\"SELECT COUNT(*) as count FROM rooms WHERE status = 'booked'\"),\n    sqlite.execute(\"SELECT COUNT(*) as count FROM rooms WHERE status = 'maintenance'\"),\n    sqlite.execute(\"SELECT COUNT(*) as count FROM customers\"),\n    sqlite.execute(\"SELECT COUNT(*) as count FROM bookings\"),\n    sqlite.execute(\"SELECT COALESCE(SUM(grand_total), 0) as total FROM bookings WHERE payment_status = 'paid'\"),\n    sqlite.execute(\"SELECT b.*, c.full_name as customer_name, r.room_number, r.room_type FROM bookings b JOIN customers c ON b.customer_id = c.id JOIN rooms r ON b.room_id = r.id ORDER BY b.created_at DESC LIMIT 5\"),\n    sqlite.execute(\"SELECT COALESCE(AVG(rating), 0) as avg_rating, COUNT(*) as count FROM feedback\"),\n  ]);\n  return {\n    totalRooms: (totalRooms.rows[0] as any).count,\n    availableRooms: (available.rows[0] as any).count,\n    bookedRooms: (booked.rows[0] as any).count,\n    maintenanceRooms: (maintenance.rows[0] as any).count,\n    totalCustomers: (totalCustomers.rows[0] as any).count,\n    totalBookings: (totalBookings.rows[0] as any).count,\n    totalRevenue: (revenue.rows[0] as any).total,\n    recentBookings: recentBookings.rows,\n    avgRating: Number((feedbackStats.rows[0] as any).avg_rating).toFixed(1),\n    feedbackCount: (feedbackStats.rows[0] as any).count,\n  };\n}\n\n// ===== ROOMS =====\nexport async function getAllRooms() {\n  const result = await sqlite.execute(\"SELECT * FROM rooms ORDER BY room_number\");\n  return result.rows;\n}\n\nexport async function getAvailableRooms(checkIn?: string, checkOut?: string, roomType?: string) {\n  let sql = \"SELECT * FROM rooms WHERE status = 'available'\";\n  const args: any[] = [];\n  if (roomType && roomType !== \"all\") {\n    sql += \" AND room_type = ?\";\n    args.push(roomType);\n  }\n  sql += \" ORDER BY price_per_night\";\n  const result = await sqlite.execute({ sql, args });\n  return result.rows;\n}\n\nexport async function addRoom(room: any) {\n  await sqlite.execute({\n    sql: `INSERT INTO rooms (room_number, room_type, ac_type, price_per_night, status, description, max_guests, floor) \n          VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n    args: [room.room_number, room.room_type, room.ac_type, room.price_per_night, room.status || \"available\", room.description, room.max_guests, room.floor],\n  });\n}\n\nexport async function updateRoom(id: number, room: any) {\n  await sqlite.execute({\n    sql: `UPDATE rooms SET room_number=?, room_type=?, ac_type=?, price_per_night=?, status=?, description=?, max_guests=?, floor=? WHERE id=?`,\n    args: [room.room_number, room.room_type, room.ac_type, room.price_per_night, room.status, room.description, room.max_guests, room.floor, id],\n  });\n}\n\nexport async function deleteRoom(id: number) {\n  await sqlite.execute({ sql: \"DELETE FROM rooms WHERE id = ?\", args: [id] });\n}\n\n// ===== CUSTOMERS =====\nexport async function getAllCustomers() {\n  const result = await sqlite.execute(\"SELECT * FROM customers ORDER BY created_at DESC\");\n  return result.rows;\n}\n\nexport async function searchCustomers(query: string) {\n  const result = await sqlite.execute({\n    sql: \"SELECT * FROM customers WHERE full_name LIKE ? OR email LIKE ? OR phone LIKE ?\",\n    args: [`%${query}%`, `%${query}%`, `%${query}%`],\n  });\n  return result.rows;\n}\n\nexport async function addCustomer(c: any) {\n  const result = await sqlite.execute({\n    sql: `INSERT INTO customers (full_name, email, phone, id_type, id_number, address, city, country) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n    args: [c.full_name, c.email, c.phone, c.id_type, c.id_number, c.address, c.city, c.country],\n  });\n  return result;\n}\n\nexport async function updateCustomer(id: number, c: any) {\n  await sqlite.execute({\n    sql: `UPDATE customers SET full_name=?, email=?, phone=?, id_type=?, id_number=?, address=?, city=?, country=? WHERE id=?`,\n    args: [c.full_name, c.email, c.phone, c.id_type, c.id_number, c.address, c.city, c.country, id],\n  });\n}\n\nexport async function deleteCustomer(id: number) {\n  await sqlite.execute({ sql: \"DELETE FROM customers WHERE id = ?\", args: [id] });\n}\n\n// ===== BOOKINGS =====\nexport async function getAllBookings() {\n  const result = await sqlite.execute(\n    `SELECT b.*, c.full_name as customer_name, c.phone as customer_phone, r.room_number, r.room_type \n     FROM bookings b JOIN customers c ON b.customer_id = c.id JOIN rooms r ON b.room_id = r.id \n     ORDER BY b.created_at DESC`\n  );\n  return result.rows;\n}\n\nexport async function createBooking(b: any) {\n  const ref = `BK-${Date.now().toString(36).toUpperCase()}`;\n  const nights = Math.ceil((new Date(b.check_out).getTime() - new Date(b.check_in).getTime()) / (1000 * 60 * 60 * 24));\n  \n  // Get room price\n  const roomResult = await sqlite.execute({ sql: \"SELECT price_per_night FROM rooms WHERE id = ?\", args: [b.room_id] });\n  const price = (roomResult.rows[0] as any).price_per_night;\n  const totalAmount = price * nights;\n  const taxAmount = totalAmount * 0.18; // 18% GST\n  const grandTotal = totalAmount + taxAmount;\n\n  await sqlite.batch([\n    {\n      sql: `INSERT INTO bookings (booking_ref, customer_id, room_id, check_in, check_out, guests, status, total_amount, tax_amount, grand_total, payment_status, special_requests) \n            VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`,\n      args: [ref, b.customer_id, b.room_id, b.check_in, b.check_out, b.guests, \"confirmed\", totalAmount, taxAmount, grandTotal, \"pending\", b.special_requests || \"\"],\n    },\n    {\n      sql: \"UPDATE rooms SET status = 'booked' WHERE id = ?\",\n      args: [b.room_id],\n    },\n  ]);\n  return { booking_ref: ref, total_amount: totalAmount, tax_amount: taxAmount, grand_total: grandTotal, nights };\n}\n\nexport async function updateBookingStatus(id: number, status: string) {\n  const booking = await sqlite.execute({ sql: \"SELECT room_id FROM bookings WHERE id = ?\", args: [id] });\n  if (!booking.rows[0]) return;\n  \n  await sqlite.execute({ sql: \"UPDATE bookings SET status = ? WHERE id = ?\", args: [status, id] });\n  \n  if (status === \"checked_out\" || status === \"cancelled\") {\n    await sqlite.execute({ sql: \"UPDATE rooms SET status = 'available' WHERE id = ?\", args: [(booking.rows[0] as any).room_id] });\n  }\n}\n\nexport async function updatePaymentStatus(id: number, status: string, method?: string) {\n  let sql = \"UPDATE bookings SET payment_status = ?\";\n  const args: any[] = [status];\n  sql += \" WHERE id = ?\";\n  args.push(id);\n  await sqlite.execute({ sql, args });\n  \n  if (status === \"paid\") {\n    const booking = await sqlite.execute({ sql: \"SELECT id, grand_total FROM bookings WHERE id = ?\", args: [id] });\n    if (booking.rows[0]) {\n      await sqlite.execute({\n        sql: \"INSERT INTO payments (booking_id, amount, payment_method, status, transaction_id) VALUES (?, ?, ?, ?, ?)\",\n        args: [id, (booking.rows[0] as any).grand_total, method || \"cash\", \"completed\", `TXN-${Date.now().toString(36).toUpperCase()}`],\n      });\n    }\n  }\n}\n\n// ===== EMPLOYEES =====\nexport async function getAllEmployees() {\n  const result = await sqlite.execute(\"SELECT * FROM employees ORDER BY full_name\");\n  return result.rows;\n}\n\nexport async function addEmployee(e: any) {\n  await sqlite.execute({\n    sql: `INSERT INTO employees (full_name, email, phone, role, department, salary, join_date, status) VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n    args: [e.full_name, e.email, e.phone, e.role, e.department, e.salary, e.join_date, e.status || \"active\"],\n  });\n}\n\nexport async function updateEmployee(id: number, e: any) {\n  await sqlite.execute({\n    sql: `UPDATE employees SET full_name=?, email=?, phone=?, role=?, department=?, salary=?, join_date=?, status=? WHERE id=?`,\n    args: [e.full_name, e.email, e.phone, e.role, e.department, e.salary, e.join_date, e.status, id],\n  });\n}\n\nexport async function deleteEmployee(id: number) {\n  await sqlite.execute({ sql: \"DELETE FROM employees WHERE id = ?\", args: [id] });\n}\n\n// ===== FEEDBACK =====\nexport async function getAllFeedback() {\n  const result = await sqlite.execute(\"SELECT * FROM feedback ORDER BY created_at DESC\");\n  return result.rows;\n}\n\nexport async function addFeedback(f: any) {\n  await sqlite.execute({\n    sql: \"INSERT INTO feedback (booking_id, customer_name, email, rating, comment) VALUES (?, ?, ?, ?, ?)\",\n    args: [f.booking_id || null, f.customer_name, f.email, f.rating, f.comment],\n  });\n}\n\n// ===== PAYMENTS =====\nexport async function getAllPayments() {\n  const result = await sqlite.execute(\n    `SELECT p.*, b.booking_ref, c.full_name as customer_name \n     FROM payments p JOIN bookings b ON p.booking_id = b.id JOIN customers c ON b.customer_id = c.id \n     ORDER BY p.payment_date DESC`\n  );\n  return result.rows;\n}\n",[],[158,300],["D",1779300512907],[182,183],[158],"0501d060-5477-11f1-bf00-ee650bb23af1","routes.ts","0501d132-5477-11f1-bf00-ee650bb23af1",["D",1779300558691],"// API routes for the Hotel Management System\nimport { Hono } from \"npm:hono@4\";\nimport * as db from \"../database/queries.ts\";\nimport { initDatabase, seedData } from \"../database/schema.ts\";\n\nconst api = new Hono();\n\n// Initialize DB on first request\nlet dbInitialized = false;\napi.use(\"*\", async (c, next) => {\n  if (!dbInitialized) {\n    await initDatabase();\n    await seedData();\n    dbInitialized = true;\n  }\n  await next();\n});\n\n// ===== AUTH =====\napi.post(\"/auth/login\", async (c) => {\n  const { username, password } = await c.req.json();\n  const user = await db.authenticateUser(username, password);\n  if (!user) return c.json({ error: \"Invalid credentials\" }, 401);\n  return c.json({ user });\n});\n\n// ===== DASHBOARD =====\napi.get(\"/dashboard\", async (c) => {\n  const stats = await db.getDashboardStats();\n  return c.json(stats);\n});\n\n// ===== ROOMS =====\napi.get(\"/rooms\", async (c) => {\n  const rooms = await db.getAllRooms();\n  return c.json(rooms);\n});\n\napi.get(\"/rooms/available\", async (c) => {\n  const { checkIn, checkOut, type } = c.req.query();\n  const rooms = await db.getAvailableRooms(checkIn, checkOut, type);\n  return c.json(rooms);\n});\n\napi.post(\"/rooms\", async (c) => {\n  const room = await c.req.json();\n  await db.addRoom(room);\n  return c.json({ success: true });\n});\n\napi.put(\"/rooms/:id\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  const room = await c.req.json();\n  await db.updateRoom(id, room);\n  return c.json({ success: true });\n});\n\napi.delete(\"/rooms/:id\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  await db.deleteRoom(id);\n  return c.json({ success: true });\n});\n\n// ===== CUSTOMERS =====\napi.get(\"/customers\", async (c) => {\n  const { search } = c.req.query();\n  const customers = search ? await db.searchCustomers(search) : await db.getAllCustomers();\n  return c.json(customers);\n});\n\napi.post(\"/customers\", async (c) => {\n  const customer = await c.req.json();\n  await db.addCustomer(customer);\n  return c.json({ success: true });\n});\n\napi.put(\"/customers/:id\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  const customer = await c.req.json();\n  await db.updateCustomer(id, customer);\n  return c.json({ success: true });\n});\n\napi.delete(\"/customers/:id\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  await db.deleteCustomer(id);\n  return c.json({ success: true });\n});\n\n// ===== BOOKINGS =====\napi.get(\"/bookings\", async (c) => {\n  const bookings = await db.getAllBookings();\n  return c.json(bookings);\n});\n\napi.post(\"/bookings\", async (c) => {\n  const booking = await c.req.json();\n  const result = await db.createBooking(booking);\n  return c.json(result);\n});\n\napi.put(\"/bookings/:id/status\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  const { status } = await c.req.json();\n  await db.updateBookingStatus(id, status);\n  return c.json({ success: true });\n});\n\napi.put(\"/bookings/:id/payment\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  const { status, method } = await c.req.json();\n  await db.updatePaymentStatus(id, status, method);\n  return c.json({ success: true });\n});\n\n// ===== EMPLOYEES =====\napi.get(\"/employees\", async (c) => {\n  const employees = await db.getAllEmployees();\n  return c.json(employees);\n});\n\napi.post(\"/employees\", async (c) => {\n  const employee = await c.req.json();\n  await db.addEmployee(employee);\n  return c.json({ success: true });\n});\n\napi.put(\"/employees/:id\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  const employee = await c.req.json();\n  await db.updateEmployee(id, employee);\n  return c.json({ success: true });\n});\n\napi.delete(\"/employees/:id\", async (c) => {\n  const id = parseInt(c.req.param(\"id\"));\n  await db.deleteEmployee(id);\n  return c.json({ success: true });\n});\n\n// ===== FEEDBACK =====\napi.get(\"/feedback\", async (c) => {\n  const feedback = await db.getAllFeedback();\n  return c.json(feedback);\n});\n\napi.post(\"/feedback\", async (c) => {\n  const fb = await c.req.json();\n  await db.addFeedback(fb);\n  return c.json({ success: true });\n});\n\n// ===== PAYMENTS =====\napi.get(\"/payments\", async (c) => {\n  const payments = await db.getAllPayments();\n  return c.json(payments);\n});\n\nexport default api;\n",[],[164,311],["D",1779300558691],[180],[164],["D",1779300470926],["D",1789501878689],{"_105":104,"_113":109},{"_105":104,"_106":107,"_108":109,"_19":60,"_110":111,"_112":30},{"_13":94,"_37":95,"_48":47,"_96":49,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":50,"_103":104},"ctx",{"_87":-5,"_133":358,"_359":360,"_361":362,"_363":30,"_364":30,"_365":30,"_366":64,"_367":-5,"_368":-7,"_369":-7,"_370":68,"_371":30,"_372":30,"_373":-5,"_374":30,"_375":30,"_376":30,"_377":-5},"ENV",{"_329":330,"_331":332,"_333":95,"_334":335,"_336":337,"_338":339,"_340":341,"_342":343,"_344":345,"_346":347,"_348":349,"_350":351,"_352":353,"_354":355,"_356":357},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]
</article></body></html>

Diff · v14