function MainComponent() { const { data: user, loading } = useUser(); const [vehiclePrice, setVehiclePrice] = useState(30000); const [downPayment, setDownPayment] = useState(5000); const [loanTerm, setLoanTerm] = useState(48); const [interestRate, setInterestRate] = useState(3.5); const [monthlyPayment, setMonthlyPayment] = useState(0); const [totalPayment, setTotalPayment] = useState(0); const [totalInterest, setTotalInterest] = useState(0); const [showResults, setShowResults] = useState(false); const [amortizationSchedule, setAmortizationSchedule] = useState([]); const [formData, setFormData] = useState({ firstName: "", lastName: "", email: "", phone: "", inquiryType: "financing", vehicleInterest: "", message: "" }); const [isSubmitting, setIsSubmitting] = useState(false); const [submitSuccess, setSubmitSuccess] = useState(false); const [submitError, setSubmitError] = useState(""); const calculateLoan = ()=>{ const loanAmount = vehiclePrice - downPayment; const monthlyRate = interestRate / 100 / 12; const numPayments = loanTerm; const x = Math.pow(1 + monthlyRate, numPayments); const monthly = loanAmount * x * monthlyRate / (x - 1); setMonthlyPayment(monthly); setTotalPayment(monthly * numPayments); setTotalInterest(monthly * numPayments - loanAmount); const schedule = []; let remainingBalance = loanAmount; let totalPaid = 0; for(let i = 1; i <= numPayments; i++){ const interestPayment = remainingBalance * monthlyRate; const principalPayment = monthly - interestPayment; remainingBalance -= principalPayment; totalPaid += monthly; if (i % 12 === 0 || i === 1 || i === numPayments) { schedule.push({ month: i, payment: monthly, principal: principalPayment, interest: interestPayment, totalPaid: totalPaid, remainingBalance: Math.max(0, remainingBalance) }); } } setAmortizationSchedule(schedule); setShowResults(true); }; const handleInputChange = (e)=>{ const { name, value } = e.target; setFormData({ ...formData, [name]: value }); }; const handleSubmit = async (e)=>{ e.preventDefault(); setIsSubmitting(true); setSubmitError(""); try { const response = await fetch("/api/contact/submit", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ formType: "automobile", formData: formData }) }); if (!response.ok) { throw new Error(`Der Server antwortete mit ${response.status}`); } const data = await response.json(); if (data.success) { setSubmitSuccess(true); setFormData({ firstName: "", lastName: "", email: "", phone: "", inquiryType: "financing", vehicleInterest: "", message: "" }); } else { setSubmitError(data.error || "Ein Fehler ist aufgetreten. Bitte versuchen Sie es später erneut."); } } catch (error) { console.error("Fehler beim Absenden des Formulars:", error); setSubmitError("Ein Fehler ist aufgetreten. Bitte versuchen Sie es später erneut."); } finally{ setIsSubmitting(false); } }; return /*#__PURE__*/ React.createElement("div", { className: "flex min-h-screen w-full flex-col bg-white", __source: { fileName: "", lineNumber: 118, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "sticky top-0 z-10 bg-white shadow-md", __source: { fileName: "", lineNumber: 119, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto flex max-w-7xl items-center justify-between px-4 py-3 md:px-6", __source: { fileName: "", lineNumber: 120, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 121, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center", __source: { fileName: "", lineNumber: 122, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mr-3 h-10 w-16 rounded bg-[#0047AB] text-white", __source: { fileName: "", lineNumber: 123, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex h-full items-center justify-center font-bold", __source: { fileName: "", lineNumber: 124, columnNumber: 17 }, __self: this }, "BFS")), /*#__PURE__*/ React.createElement("h1", { className: "hidden text-lg font-bold text-gray-800 md:block", __source: { fileName: "", lineNumber: 128, columnNumber: 15 }, __self: this }, "Braun Finance Services"))), /*#__PURE__*/ React.createElement("div", { className: "hidden max-w-xl text-center text-sm text-gray-600 md:block", __source: { fileName: "", lineNumber: 134, columnNumber: 11 }, __self: this }, "Ihr vertrauenswürdiger Partner für Finanzen, Immobilien und Automobile."), loading ? /*#__PURE__*/ React.createElement("div", { className: "h-6 w-6 animate-spin rounded-full border-2 border-blue-200 border-t-[#0047AB]", __source: { fileName: "", lineNumber: 140, columnNumber: 13 }, __self: this }) : /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 142, columnNumber: 13 }, __self: this }, user ? /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "rounded-lg bg-[#0047AB] px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-[#003380]", __source: { fileName: "", lineNumber: 144, columnNumber: 17 }, __self: this }, "Abmelden") : /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "rounded-lg bg-[#0047AB] px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-[#003380]", __source: { fileName: "", lineNumber: 151, columnNumber: 17 }, __self: this }, "Anmelden")))), /*#__PURE__*/ React.createElement("section", { className: "relative flex h-[250px] w-full items-center justify-center bg-[url('/images/auto-finance-hero.jpg')] bg-cover bg-center", __source: { fileName: "", lineNumber: 163, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-[#0047AB] bg-opacity-70", __source: { fileName: "", lineNumber: 164, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "z-10 mx-auto max-w-4xl px-4 text-center text-white", __source: { fileName: "", lineNumber: 165, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-4 text-3xl font-bold md:text-4xl", __source: { fileName: "", lineNumber: 166, columnNumber: 11 }, __self: this }, "Autofinanzierungsrechner"), /*#__PURE__*/ React.createElement("p", { className: "mb-6 text-lg md:text-xl", __source: { fileName: "", lineNumber: 169, columnNumber: 11 }, __self: this }, "Berechnen Sie Ihre monatliche Rate und planen Sie Ihre Autofinanzierung"))), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 py-2", __source: { fileName: "", lineNumber: 175, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl px-4", __source: { fileName: "", lineNumber: 176, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center text-sm text-gray-600", __source: { fileName: "", lineNumber: 177, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "hover:text-[#0047AB]", __source: { fileName: "", lineNumber: 178, columnNumber: 13 }, __self: this }, "Startseite"), /*#__PURE__*/ React.createElement("span", { className: "mx-2", __source: { fileName: "", lineNumber: 181, columnNumber: 13 }, __self: this }, "/"), /*#__PURE__*/ React.createElement("a", { href: "/automobiles", className: "hover:text-[#0047AB]", __source: { fileName: "", lineNumber: 182, columnNumber: 13 }, __self: this }, "Automobile"), /*#__PURE__*/ React.createElement("span", { className: "mx-2", __source: { fileName: "", lineNumber: 185, columnNumber: 13 }, __self: this }, "/"), /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#0047AB]", __source: { fileName: "", lineNumber: 186, columnNumber: 13 }, __self: this }, "Finanzierungsrechner")))), /*#__PURE__*/ React.createElement("main", { className: "flex-grow py-8", __source: { fileName: "", lineNumber: 191, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-6xl px-4", __source: { fileName: "", lineNumber: 192, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-12 rounded-lg bg-white p-6 shadow-md", __source: { fileName: "", lineNumber: 193, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-6 text-xl font-semibold text-gray-800", __source: { fileName: "", lineNumber: 194, columnNumber: 13 }, __self: this }, "Berechnen Sie Ihre monatliche Autofinanzierung"), /*#__PURE__*/ React.createElement("div", { className: "grid gap-6 md:grid-cols-4", __source: { fileName: "", lineNumber: 196, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 197, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 198, columnNumber: 17 }, __self: this }, "Fahrzeugpreis (CHF)"), /*#__PURE__*/ React.createElement("input", { type: "number", value: vehiclePrice, onChange: (e)=>setVehiclePrice(Number(e.target.value)), className: "w-full rounded-md border border-gray-300 p-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 201, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "range", min: "5000", max: "200000", step: "1000", value: vehiclePrice, onChange: (e)=>setVehiclePrice(Number(e.target.value)), className: "mt-2 w-full", __source: { fileName: "", lineNumber: 207, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between text-xs text-gray-500", __source: { fileName: "", lineNumber: 216, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 217, columnNumber: 19 }, __self: this }, "5.000 CHF"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 218, columnNumber: 19 }, __self: this }, "200.000 CHF"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 222, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 223, columnNumber: 17 }, __self: this }, "Anzahlung (CHF)"), /*#__PURE__*/ React.createElement("input", { type: "number", value: downPayment, onChange: (e)=>setDownPayment(Number(e.target.value)), className: "w-full rounded-md border border-gray-300 p-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 226, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "range", min: "0", max: vehiclePrice * 0.5, step: "1000", value: downPayment, onChange: (e)=>setDownPayment(Number(e.target.value)), className: "mt-2 w-full", __source: { fileName: "", lineNumber: 232, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between text-xs text-gray-500", __source: { fileName: "", lineNumber: 241, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 242, columnNumber: 19 }, __self: this }, "0 CHF"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 243, columnNumber: 19 }, __self: this }, (vehiclePrice * 0.5).toLocaleString(), " CHF"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 247, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 248, columnNumber: 17 }, __self: this }, "Laufzeit (Monate)"), /*#__PURE__*/ React.createElement("input", { type: "number", value: loanTerm, onChange: (e)=>setLoanTerm(Number(e.target.value)), className: "w-full rounded-md border border-gray-300 p-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 251, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "range", min: "12", max: "84", step: "12", value: loanTerm, onChange: (e)=>setLoanTerm(Number(e.target.value)), className: "mt-2 w-full", __source: { fileName: "", lineNumber: 257, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between text-xs text-gray-500", __source: { fileName: "", lineNumber: 266, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 267, columnNumber: 19 }, __self: this }, "12 Monate"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 268, columnNumber: 19 }, __self: this }, "84 Monate"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 272, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 273, columnNumber: 17 }, __self: this }, "Zinssatz (%)"), /*#__PURE__*/ React.createElement("input", { type: "number", step: "0.1", value: interestRate, onChange: (e)=>setInterestRate(Number(e.target.value)), className: "w-full rounded-md border border-gray-300 p-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 276, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "range", min: "0.5", max: "10", step: "0.1", value: interestRate, onChange: (e)=>setInterestRate(Number(e.target.value)), className: "mt-2 w-full", __source: { fileName: "", lineNumber: 283, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between text-xs text-gray-500", __source: { fileName: "", lineNumber: 292, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 293, columnNumber: 19 }, __self: this }, "0.5%"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 294, columnNumber: 19 }, __self: this }, "10%")))), /*#__PURE__*/ React.createElement("div", { className: "mt-6 flex justify-center", __source: { fileName: "", lineNumber: 299, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: calculateLoan, className: "rounded-lg bg-[#0047AB] px-8 py-3 font-medium text-white transition-colors hover:bg-[#003380]", __source: { fileName: "", lineNumber: 300, columnNumber: 15 }, __self: this }, "Berechnen")), showResults && /*#__PURE__*/ React.createElement("div", { className: "mt-8 border-t border-gray-200 pt-8", __source: { fileName: "", lineNumber: 309, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "mb-4 text-lg font-semibold text-gray-800", __source: { fileName: "", lineNumber: 310, columnNumber: 17 }, __self: this }, "Ergebnis der Berechnung"), /*#__PURE__*/ React.createElement("div", { className: "mb-6 grid gap-4 md:grid-cols-3", __source: { fileName: "", lineNumber: 312, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-blue-50 p-4 text-center", __source: { fileName: "", lineNumber: 313, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 314, columnNumber: 21 }, __self: this }, "Monatliche Rate"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-[#0047AB]", __source: { fileName: "", lineNumber: 315, columnNumber: 21 }, __self: this }, monthlyPayment.toFixed(2), " CHF")), /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-blue-50 p-4 text-center", __source: { fileName: "", lineNumber: 320, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 321, columnNumber: 21 }, __self: this }, "Gesamtzahlung"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-[#0047AB]", __source: { fileName: "", lineNumber: 322, columnNumber: 21 }, __self: this }, totalPayment.toFixed(2), " CHF")), /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-blue-50 p-4 text-center", __source: { fileName: "", lineNumber: 327, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 328, columnNumber: 21 }, __self: this }, "Gesamtzinsen"), /*#__PURE__*/ React.createElement("p", { className: "text-2xl font-bold text-[#0047AB]", __source: { fileName: "", lineNumber: 329, columnNumber: 21 }, __self: this }, totalInterest.toFixed(2), " CHF"))), /*#__PURE__*/ React.createElement("h4", { className: "mb-3 text-md font-semibold text-gray-800", __source: { fileName: "", lineNumber: 335, columnNumber: 17 }, __self: this }, "Tilgungsplan"), /*#__PURE__*/ React.createElement("div", { className: "overflow-x-auto", __source: { fileName: "", lineNumber: 336, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("table", { className: "min-w-full divide-y divide-gray-200", __source: { fileName: "", lineNumber: 337, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { className: "bg-gray-50", __source: { fileName: "", lineNumber: 338, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { __source: { fileName: "", lineNumber: 339, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500", __source: { fileName: "", lineNumber: 340, columnNumber: 25 }, __self: this }, "Monat"), /*#__PURE__*/ React.createElement("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500", __source: { fileName: "", lineNumber: 343, columnNumber: 25 }, __self: this }, "Zahlung"), /*#__PURE__*/ React.createElement("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500", __source: { fileName: "", lineNumber: 346, columnNumber: 25 }, __self: this }, "Tilgung"), /*#__PURE__*/ React.createElement("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500", __source: { fileName: "", lineNumber: 349, columnNumber: 25 }, __self: this }, "Zinsen"), /*#__PURE__*/ React.createElement("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500", __source: { fileName: "", lineNumber: 352, columnNumber: 25 }, __self: this }, "Bereits bezahlt"), /*#__PURE__*/ React.createElement("th", { scope: "col", className: "px-6 py-3 text-left text-xs font-medium uppercase tracking-wider text-gray-500", __source: { fileName: "", lineNumber: 355, columnNumber: 25 }, __self: this }, "Restschuld"))), /*#__PURE__*/ React.createElement("tbody", { className: "divide-y divide-gray-200 bg-white", __source: { fileName: "", lineNumber: 360, columnNumber: 21 }, __self: this }, amortizationSchedule.map((row)=>/*#__PURE__*/ React.createElement("tr", { key: row.month, __source: { fileName: "", lineNumber: 362, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "whitespace-nowrap px-6 py-4 text-sm text-gray-500", __source: { fileName: "", lineNumber: 363, columnNumber: 27 }, __self: this }, row.month), /*#__PURE__*/ React.createElement("td", { className: "whitespace-nowrap px-6 py-4 text-sm text-gray-500", __source: { fileName: "", lineNumber: 366, columnNumber: 27 }, __self: this }, row.payment.toFixed(2), " CHF"), /*#__PURE__*/ React.createElement("td", { className: "whitespace-nowrap px-6 py-4 text-sm text-gray-500", __source: { fileName: "", lineNumber: 369, columnNumber: 27 }, __self: this }, row.principal.toFixed(2), " CHF"), /*#__PURE__*/ React.createElement("td", { className: "whitespace-nowrap px-6 py-4 text-sm text-gray-500", __source: { fileName: "", lineNumber: 372, columnNumber: 27 }, __self: this }, row.interest.toFixed(2), " CHF"), /*#__PURE__*/ React.createElement("td", { className: "whitespace-nowrap px-6 py-4 text-sm text-gray-500", __source: { fileName: "", lineNumber: 375, columnNumber: 27 }, __self: this }, row.totalPaid.toFixed(2), " CHF"), /*#__PURE__*/ React.createElement("td", { className: "whitespace-nowrap px-6 py-4 text-sm text-gray-500", __source: { fileName: "", lineNumber: 378, columnNumber: 27 }, __self: this }, row.remainingBalance.toFixed(2), " CHF")))))))), /*#__PURE__*/ React.createElement("div", { className: "mb-12 rounded-lg bg-white p-6 shadow-md", __source: { fileName: "", lineNumber: 390, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-6 text-xl font-semibold text-gray-800", __source: { fileName: "", lineNumber: 391, columnNumber: 13 }, __self: this }, "Kontaktieren Sie uns für Ihre Autofinanzierung"), submitSuccess ? /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-green-50 p-6 text-center", __source: { fileName: "", lineNumber: 394, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check-circle mb-4 text-4xl text-green-500", __source: { fileName: "", lineNumber: 395, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "mb-2 text-xl font-bold text-green-700", __source: { fileName: "", lineNumber: 396, columnNumber: 17 }, __self: this }, "Vielen Dank für Ihre Anfrage!"), /*#__PURE__*/ React.createElement("p", { className: "mb-4 text-green-600", __source: { fileName: "", lineNumber: 399, columnNumber: 17 }, __self: this }, "Wir werden uns in Kürze mit Ihnen in Verbindung setzen."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSubmitSuccess(false), className: "rounded-lg bg-[#0047AB] px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-[#003380]", __source: { fileName: "", lineNumber: 402, columnNumber: 17 }, __self: this }, "Neues Formular")) : /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 410, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid gap-6 md:grid-cols-2", __source: { fileName: "", lineNumber: 411, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 412, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "firstName", className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 413, columnNumber: 21 }, __self: this }, "Vorname*"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "firstName", name: "firstName", value: formData.firstName, onChange: handleInputChange, required: true, className: "w-full rounded-lg border border-gray-300 px-4 py-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 419, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 430, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "lastName", className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 431, columnNumber: 21 }, __self: this }, "Nachname*"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "lastName", name: "lastName", value: formData.lastName, onChange: handleInputChange, required: true, className: "w-full rounded-lg border border-gray-300 px-4 py-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 437, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 448, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 449, columnNumber: 21 }, __self: this }, "E-Mail*"), /*#__PURE__*/ React.createElement("input", { type: "email", id: "email", name: "email", value: formData.email, onChange: handleInputChange, required: true, className: "w-full rounded-lg border border-gray-300 px-4 py-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 455, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 466, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "phone", className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 467, columnNumber: 21 }, __self: this }, "Telefon*"), /*#__PURE__*/ React.createElement("input", { type: "tel", id: "phone", name: "phone", value: formData.phone, onChange: handleInputChange, required: true, className: "w-full rounded-lg border border-gray-300 px-4 py-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 473, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 484, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "inquiryType", className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 485, columnNumber: 21 }, __self: this }, "Art der Anfrage*"), /*#__PURE__*/ React.createElement("select", { id: "inquiryType", name: "inquiryType", value: formData.inquiryType, onChange: handleInputChange, required: true, className: "w-full rounded-lg border border-gray-300 px-4 py-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 491, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "financing", __source: { fileName: "", lineNumber: 499, columnNumber: 23 }, __self: this }, "Finanzierung"), /*#__PURE__*/ React.createElement("option", { value: "leasing", __source: { fileName: "", lineNumber: 500, columnNumber: 23 }, __self: this }, "Leasing"), /*#__PURE__*/ React.createElement("option", { value: "general", __source: { fileName: "", lineNumber: 501, columnNumber: 23 }, __self: this }, "Allgemeine Anfrage"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 505, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "vehicleInterest", className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 506, columnNumber: 21 }, __self: this }, "Fahrzeuginteresse"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "vehicleInterest", name: "vehicleInterest", value: formData.vehicleInterest, onChange: handleInputChange, placeholder: "z.B. BMW X5, VW Golf, etc.", className: "w-full rounded-lg border border-gray-300 px-4 py-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 512, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "md:col-span-2", __source: { fileName: "", lineNumber: 523, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "message", className: "mb-2 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 524, columnNumber: 21 }, __self: this }, "Nachricht"), /*#__PURE__*/ React.createElement("textarea", { id: "message", name: "message", value: formData.message, onChange: handleInputChange, rows: "4", className: "w-full rounded-lg border border-gray-300 px-4 py-2 focus:border-[#0047AB] focus:outline-none focus:ring-1 focus:ring-[#0047AB]", __source: { fileName: "", lineNumber: 530, columnNumber: 21 }, __self: this }))), submitError && /*#__PURE__*/ React.createElement("div", { className: "mt-4 rounded-lg bg-red-50 p-4 text-sm text-red-600", __source: { fileName: "", lineNumber: 542, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 543, columnNumber: 21 }, __self: this }, submitError)), /*#__PURE__*/ React.createElement("div", { className: "mt-6 flex justify-center", __source: { fileName: "", lineNumber: 547, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitting, className: "rounded-lg bg-[#0047AB] px-8 py-3 font-medium text-white transition-colors hover:bg-[#003380] disabled:opacity-50", __source: { fileName: "", lineNumber: 548, columnNumber: 19 }, __self: this }, isSubmitting ? "Wird gesendet..." : "Anfrage senden")))))), /*#__PURE__*/ React.createElement("footer", { className: "mt-auto bg-[#0047AB] py-8 text-white", __source: { fileName: "", lineNumber: 562, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-6xl px-4", __source: { fileName: "", lineNumber: 563, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 gap-8 md:grid-cols-2", __source: { fileName: "", lineNumber: 564, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 565, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "mb-4 text-xl font-bold", __source: { fileName: "", lineNumber: 566, columnNumber: 15 }, __self: this }, "BFS Braun Finance Services"), /*#__PURE__*/ React.createElement("p", { className: "mb-2 text-sm", __source: { fileName: "", lineNumber: 569, columnNumber: 15 }, __self: this }, "Ihr vertrauenswürdiger Partner für Finanzen, Immobilien und Automobile."), /*#__PURE__*/ React.createElement("div", { className: "mt-4 flex space-x-4", __source: { fileName: "", lineNumber: 573, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-white hover:text-blue-200", __source: { fileName: "", lineNumber: 574, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-facebook-f", __source: { fileName: "", lineNumber: 575, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-white hover:text-blue-200", __source: { fileName: "", lineNumber: 577, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-twitter", __source: { fileName: "", lineNumber: 578, columnNumber: 19 }, __self: this })))))))); }