function MainComponent() { const [showVariationInfo, setShowVariationInfo] = useState(false); const [showBreakdown, setShowBreakdown] = useState(false); const [surfaceType, setSurfaceType] = useState("Playground"); const [rubberType, setRubberType] = useState("Plain black SBR"); const [thickness, setThickness] = useState("15mm standard"); const [subBase, setSubBase] = useState("Firm concrete/ashpalt"); const [area, setArea] = useState(""); const [showModal, setShowModal] = useState(false); const [showBankDetails, setShowBankDetails] = useState(false); const [showPhotoForm, setShowPhotoForm] = useState(false); const [confirmationMessage, setConfirmationMessage] = useState(""); const [formData, setFormData] = useState({ fullName: "", phoneNumber: "", notes: "", photos: [] }); const [upload, { loading: uploading }] = useUpload(); const calculateCosts = ()=>{ if (!area || isNaN(area)) return { materials: 0, labor: 0, additional: 0 }; let materials = 0; let labor = 0; let additional = 0; switch(rubberType){ case "EPDM": materials += 180; break; case "PCSBR": materials += 110; break; case "Plain black SBR": materials += 90; break; } if (thickness === "60mm 1.5 fall zone") { materials += 80; } switch(surfaceType){ case "Pool": additional += 50; break; case "Equine": additional += 30; break; } if (subBase === "Landscaping required grass/dirt") { labor += 40; } const perM2 = materials + labor + additional; return { materials: materials * parseFloat(area), labor: labor * parseFloat(area), additional: additional * parseFloat(area), perM2: perM2 }; }; const calculateTotal = ()=>{ const costs = calculateCosts(); const baseTotal = costs.materials + costs.labor + costs.additional; return { lowEnd: baseTotal * 1.1, highEnd: baseTotal * 1.2, perM2: costs.perM2 }; }; const totals = calculateTotal(); const buttonStyle = { padding: "10px 20px", backgroundColor: "#4CAF50", color: "white", border: "none", borderRadius: "6px", cursor: "pointer", fontSize: "15px", margin: "5px", transition: "all 0.2s ease", boxShadow: "0 2px 4px rgba(0,0,0,0.1)", fontWeight: "500" }; const ModalContent = useMemo(()=>{ return /*#__PURE__*/ React.createElement("div", { style: { position: "fixed", top: 0, left: 0, right: 0, bottom: 0, backgroundColor: "rgba(0,0,0,0.5)", display: "flex", justifyContent: "center", alignItems: "center", zIndex: 1000 }, __source: { fileName: "", lineNumber: 95, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { backgroundColor: "white", padding: "30px", borderRadius: "8px", width: "500px", maxWidth: "90%", maxHeight: "90vh", position: "fixed", top: "50%", left: "50%", transform: "translate(-50%, -50%)", overflowY: "auto" }, __source: { fileName: "", lineNumber: 109, columnNumber: 9 }, __self: this }, confirmationMessage ? /*#__PURE__*/ React.createElement("div", { style: { textAlign: "center" }, __source: { fileName: "", lineNumber: 125, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, confirmationMessage), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowModal(false); setConfirmationMessage(""); }, style: { padding: "10px 20px", backgroundColor: "#4CAF50", color: "white", border: "none", borderRadius: "4px", cursor: "pointer", marginTop: "15px" }, __source: { fileName: "", lineNumber: 127, columnNumber: 15 }, __self: this }, "Close")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { style: { textAlign: "center", marginBottom: "20px" }, __source: { fileName: "", lineNumber: 147, columnNumber: 15 }, __self: this }, "How would you like to confirm your price range?"), /*#__PURE__*/ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "15px" }, __source: { fileName: "", lineNumber: 151, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: async ()=>{ window.location.href = "https://buy.stripe.com/4gweYkgg65sI5jibII"; setConfirmationMessage("Thanks! Please take a screenshot of your calculator results and email it to sales@rubberfloor.com.au - You'll be contacted within 24 hrs to confirm your site visit."); }, style: { padding: "15px", backgroundColor: "#635BFF", color: "white", border: "none", borderRadius: "4px", cursor: "pointer", fontSize: "16px", display: "flex", alignItems: "center", gap: "10px" }, __source: { fileName: "", lineNumber: 158, columnNumber: 17 }, __self: this }, "💳 Pay A$200 via Card (Instant Lock-In)"), /*#__PURE__*/ React.createElement("p", { style: { fontSize: "12px", color: "#666", margin: "0 0 15px 0" }, __source: { fileName: "", lineNumber: 181, columnNumber: 17 }, __self: this }, "Booking fee is fully credited toward your invoice.", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 189, columnNumber: 19 }, __self: this }), "Refunded only if your site is unsuitable and no quote is issued.", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 192, columnNumber: 19 }, __self: this }), "Non-refundable for cancellations, no-shows, or blocked access.", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 194, columnNumber: 19 }, __self: this }), "Please take a screenshot of your calculator results and email it to sales@rubberfloor.com.au"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowBankDetails(!showBankDetails), style: { padding: "15px", backgroundColor: "#2196F3", color: "white", border: "none", borderRadius: "4px", cursor: "pointer", fontSize: "16px", display: "flex", alignItems: "center", gap: "10px" }, __source: { fileName: "", lineNumber: 199, columnNumber: 17 }, __self: this }, "🏦 Pay A$200 via Bank Transfer"), showBankDetails && /*#__PURE__*/ React.createElement("div", { style: { padding: "15px", backgroundColor: "#f5f5f5", borderRadius: "4px", fontSize: "14px" }, __source: { fileName: "", lineNumber: 218, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 226, columnNumber: 21 }, __self: this }, "After payment, please email your remittance/screenshot AND calculator results to", " ", /*#__PURE__*/ React.createElement("a", { href: "mailto:sales@rubberfloor.com.au", __source: { fileName: "", lineNumber: 229, columnNumber: 23 }, __self: this }, "sales@rubberfloor.com.au")), /*#__PURE__*/ React.createElement("ul", { style: { listStyle: "none", padding: 0, margin: "10px 0" }, __source: { fileName: "", lineNumber: 233, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 240, columnNumber: 23 }, __self: this }, "Account Name: Rubber Floor Solutions PTY LTD"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 241, columnNumber: 23 }, __self: this }, "BSB: 063-133"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 242, columnNumber: 23 }, __self: this }, "Account Number: 11535819"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 243, columnNumber: 23 }, __self: this }, "Amount: A$200"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 244, columnNumber: 23 }, __self: this }, "Reference: Your Name + address"))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowPhotoForm(!showPhotoForm), style: { padding: "15px", backgroundColor: "#4CAF50", color: "white", border: "none", borderRadius: "4px", cursor: "pointer", fontSize: "16px", display: "flex", alignItems: "center", gap: "10px" }, __source: { fileName: "", lineNumber: 249, columnNumber: 17 }, __self: this }, "📷 Send Photos for Free Remote Quote"), showPhotoForm && /*#__PURE__*/ React.createElement("div", { style: { marginTop: "15px" }, __source: { fileName: "", lineNumber: 268, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { style: { marginBottom: "15px" }, __source: { fileName: "", lineNumber: 269, columnNumber: 21 }, __self: this }, "To receive an accurate and detailed quote, please follow these quick steps:", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 272, columnNumber: 23 }, __self: this }), "1. ", /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 273, columnNumber: 26 }, __self: this }, "Take a screenshot"), " of your calculator selections above", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 275, columnNumber: 23 }, __self: this }), "2. ", /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 276, columnNumber: 26 }, __self: this }, "Visit:"), " ", /*#__PURE__*/ React.createElement("a", { href: "https://tradehq.com.au/rubberfloor/#enquiry", target: "_blank", rel: "noopener noreferrer", __source: { fileName: "", lineNumber: 277, columnNumber: 23 }, __self: this }, "https://tradehq.com.au/rubberfloor/#enquiry"), /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 284, columnNumber: 23 }, __self: this }), "3. ", /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 285, columnNumber: 26 }, __self: this }, "Upload your photos"), " and include a clear description of your job — surface type, access, any slopes or details we should know"), /*#__PURE__*/ React.createElement("p", { style: { backgroundColor: "#f5f5f5", padding: "10px", borderRadius: "4px" }, __source: { fileName: "", lineNumber: 289, columnNumber: 21 }, __self: this }, "💡 The more accurate your information, the faster we can confirm your price and provide a tailored solution.", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 298, columnNumber: 23 }, __self: this }), "You'll receive a detailed quote within 24 hours."))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowModal(false), style: { position: "absolute", top: "10px", right: "10px", background: "none", border: "none", fontSize: "20px", cursor: "pointer" }, __source: { fileName: "", lineNumber: 305, columnNumber: 15 }, __self: this }, "✕")))); }, [ showPhotoForm, showBankDetails, confirmationMessage ]); const sectionStyle = { marginBottom: "8px", border: "1px solid #e0e0e0", padding: "8px", borderRadius: "8px", backgroundColor: "#ffffff", boxShadow: "0 2px 4px rgba(0,0,0,0.05)" }; const labelStyle = { display: "block", marginBottom: "6px", fontSize: "16px", fontWeight: "600", color: "#1976D2" }; const selectStyle = { width: "100%", padding: "8px", fontSize: "15px", borderRadius: "6px", border: "1px solid #e0e0e0", backgroundColor: "#f8f9fa", cursor: "pointer", color: "#2c3e50" }; return /*#__PURE__*/ React.createElement("div", { style: { maxWidth: "100%", padding: "8px", minHeight: "100vh", display: "flex", flexDirection: "column" }, __source: { fileName: "", lineNumber: 355, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { maxWidth: "450px", margin: "0 auto", width: "100%", display: "flex", flexDirection: "column" }, __source: { fileName: "", lineNumber: 364, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { style: { textAlign: "center", marginBottom: "10px", fontSize: "20px", color: "#1976D2", fontWeight: "600" }, __source: { fileName: "", lineNumber: 373, columnNumber: 9 }, __self: this }, "Get Your Custom Rubber Surface Quote"), /*#__PURE__*/ React.createElement("div", { style: sectionStyle, __source: { fileName: "", lineNumber: 385, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { style: labelStyle, __source: { fileName: "", lineNumber: 386, columnNumber: 11 }, __self: this }, "Surface Type:"), /*#__PURE__*/ React.createElement("select", { value: surfaceType, onChange: (e)=>setSurfaceType(e.target.value), style: { ...selectStyle, fontSize: "16px" }, __source: { fileName: "", lineNumber: 387, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "Playground", __source: { fileName: "", lineNumber: 392, columnNumber: 13 }, __self: this }, "Playground • Standard Surface (included)"), /*#__PURE__*/ React.createElement("option", { value: "Gym", __source: { fileName: "", lineNumber: 395, columnNumber: 13 }, __self: this }, "Gym • Standard Surface (included)"), /*#__PURE__*/ React.createElement("option", { value: "Pool", __source: { fileName: "", lineNumber: 396, columnNumber: 13 }, __self: this }, "Pool • Premium Surface (+$50/m²)"), /*#__PURE__*/ React.createElement("option", { value: "Equine", __source: { fileName: "", lineNumber: 397, columnNumber: 13 }, __self: this }, "Equine • Specialty Surface (+$30/m²)"), /*#__PURE__*/ React.createElement("option", { value: "Path", __source: { fileName: "", lineNumber: 398, columnNumber: 13 }, __self: this }, "Path • Standard Surface (included)"))), /*#__PURE__*/ React.createElement("div", { style: sectionStyle, __source: { fileName: "", lineNumber: 402, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { style: labelStyle, __source: { fileName: "", lineNumber: 403, columnNumber: 11 }, __self: this }, "Rubber Type:"), /*#__PURE__*/ React.createElement("select", { value: rubberType, onChange: (e)=>setRubberType(e.target.value), style: { ...selectStyle, fontSize: "16px" }, __source: { fileName: "", lineNumber: 404, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "EPDM", __source: { fileName: "", lineNumber: 409, columnNumber: 13 }, __self: this }, "EPDM • Brighter colour ($180/m²)"), /*#__PURE__*/ React.createElement("option", { value: "PCSBR", __source: { fileName: "", lineNumber: 410, columnNumber: 13 }, __self: this }, "PCSBR • Coated colour ($110/m²)"), /*#__PURE__*/ React.createElement("option", { value: "Plain black SBR", __source: { fileName: "", lineNumber: 411, columnNumber: 13 }, __self: this }, "Plain Black SBR ($90/m²)"))), /*#__PURE__*/ React.createElement("div", { style: sectionStyle, __source: { fileName: "", lineNumber: 415, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { style: labelStyle, __source: { fileName: "", lineNumber: 416, columnNumber: 11 }, __self: this }, "Thickness:"), /*#__PURE__*/ React.createElement("select", { value: thickness, onChange: (e)=>setThickness(e.target.value), style: { ...selectStyle, fontSize: "16px" }, __source: { fileName: "", lineNumber: 417, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "15mm standard", __source: { fileName: "", lineNumber: 422, columnNumber: 13 }, __self: this }, "15mm • Standard Thickness (included)"), /*#__PURE__*/ React.createElement("option", { value: "60mm 1.5 fall zone", __source: { fileName: "", lineNumber: 425, columnNumber: 13 }, __self: this }, "60mm • Fall Zone Safety (+$80/m²)"))), /*#__PURE__*/ React.createElement("div", { style: sectionStyle, __source: { fileName: "", lineNumber: 431, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { style: labelStyle, __source: { fileName: "", lineNumber: 432, columnNumber: 11 }, __self: this }, "Sub Base:"), /*#__PURE__*/ React.createElement("select", { value: subBase, onChange: (e)=>setSubBase(e.target.value), style: { ...selectStyle, fontSize: "16px" }, __source: { fileName: "", lineNumber: 433, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "Firm concrete/ashpalt", __source: { fileName: "", lineNumber: 438, columnNumber: 13 }, __self: this }, "Concrete/Asphalt • Ready to Install (included)"), /*#__PURE__*/ React.createElement("option", { value: "Landscaping required grass/dirt", __source: { fileName: "", lineNumber: 441, columnNumber: 13 }, __self: this }, "Grass/Dirt • Needs Preparation (+$40/m²)"))), /*#__PURE__*/ React.createElement("div", { style: sectionStyle, __source: { fileName: "", lineNumber: 447, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { style: labelStyle, __source: { fileName: "", lineNumber: 448, columnNumber: 11 }, __self: this }, "Area (m²):"), /*#__PURE__*/ React.createElement("input", { type: "number", value: area, onChange: (e)=>setArea(e.target.value), style: { ...selectStyle, backgroundColor: "white" }, placeholder: "Enter area to see your savings", __source: { fileName: "", lineNumber: 449, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { style: { backgroundColor: "#f5f5f5", padding: "12px", borderRadius: "8px", textAlign: "center", marginTop: "15px", border: "2px solid #2196F3" }, __source: { fileName: "", lineNumber: 458, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { backgroundColor: "#2196F3", color: "white", padding: "6px", borderRadius: "4px", marginBottom: "10px", fontSize: "14px", fontWeight: "500" }, __source: { fileName: "", lineNumber: 468, columnNumber: 11 }, __self: this }, "🔥 Lock in 2025 Pricing Today"), /*#__PURE__*/ React.createElement("h2", { style: { fontSize: "17px", marginBottom: "8px" }, __source: { fileName: "", lineNumber: 482, columnNumber: 11 }, __self: this }, "Your Custom Quote"), /*#__PURE__*/ React.createElement("p", { style: { fontSize: "20px", fontWeight: "bold", marginBottom: "5px" }, __source: { fileName: "", lineNumber: 485, columnNumber: 11 }, __self: this }, "$", totals.lowEnd.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 }), " ", "- $", totals.highEnd.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 }), " ", "GST inc."), /*#__PURE__*/ React.createElement("p", { style: { fontSize: "14px", color: "#666", margin: "0 0 5px 0" }, __source: { fileName: "", lineNumber: 504, columnNumber: 11 }, __self: this }, "$", (totals.lowEnd / 1.1).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 }), " ", "- $", (totals.highEnd / 1.1).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 }), " ", "GST exc."), area && !isNaN(area) && parseFloat(area) > 0 && /*#__PURE__*/ React.createElement("p", { style: { fontSize: "14px", color: "#666", margin: "0 0 10px 0" }, __source: { fileName: "", lineNumber: 518, columnNumber: 13 }, __self: this }, "Cost per m²: $", totals.perM2.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 }), "/m²"), /*#__PURE__*/ React.createElement("div", { style: { backgroundColor: "#e3f2fd", padding: "6px", borderRadius: "4px", marginBottom: "10px", fontSize: "13px" }, __source: { fileName: "", lineNumber: 530, columnNumber: 11 }, __self: this }, "✓ Premium Materials ✓ UV Resistant ✓ Pro Installation"), /*#__PURE__*/ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "8px", width: "100%" }, __source: { fileName: "", lineNumber: 542, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowBreakdown(!showBreakdown), style: { ...buttonStyle, width: "100%", margin: "0", padding: "8px" }, __source: { fileName: "", lineNumber: 550, columnNumber: 13 }, __self: this }, "View Cost Breakdown"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowVariationInfo(!showVariationInfo), style: { ...buttonStyle, width: "100%", margin: "0", padding: "8px" }, __source: { fileName: "", lineNumber: 561, columnNumber: 13 }, __self: this }, "Why can it vary?")), showBreakdown && /*#__PURE__*/ React.createElement("div", { style: { backgroundColor: "white", padding: "10px", borderRadius: "4px", marginTop: "8px", textAlign: "left", fontSize: "13px" }, __source: { fileName: "", lineNumber: 575, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { style: { fontSize: "15px", marginBottom: "8px" }, __source: { fileName: "", lineNumber: 585, columnNumber: 15 }, __self: this }, "Cost Breakdown"), /*#__PURE__*/ React.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: "8px" }, __source: { fileName: "", lineNumber: 588, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 595, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { fontWeight: "bold" }, __source: { fileName: "", lineNumber: 596, columnNumber: 19 }, __self: this }, "Rubber Granules"), /*#__PURE__*/ React.createElement("div", { style: { color: "#666", fontSize: "12px" }, __source: { fileName: "", lineNumber: 597, columnNumber: 19 }, __self: this }, "Based on selected thickness & colour complexity"), /*#__PURE__*/ React.createElement("div", { style: { color: "#2196F3", fontWeight: "bold" }, __source: { fileName: "", lineNumber: 600, columnNumber: 19 }, __self: this }, "35%")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 604, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { fontWeight: "bold" }, __source: { fileName: "", lineNumber: 605, columnNumber: 19 }, __self: this }, "Polyurethane Binder"), /*#__PURE__*/ React.createElement("div", { style: { color: "#666", fontSize: "12px" }, __source: { fileName: "", lineNumber: 606, columnNumber: 19 }, __self: this }, "Adjust for % if using premium or coloured binder"), /*#__PURE__*/ React.createElement("div", { style: { color: "#2196F3", fontWeight: "bold" }, __source: { fileName: "", lineNumber: 609, columnNumber: 19 }, __self: this }, "20%")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 613, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { fontWeight: "bold" }, __source: { fileName: "", lineNumber: 614, columnNumber: 19 }, __self: this }, "Labour & Crew"), /*#__PURE__*/ React.createElement("div", { style: { color: "#666", fontSize: "12px" }, __source: { fileName: "", lineNumber: 615, columnNumber: 19 }, __self: this }, "Covers mixing, laying, edging, clean-up"), /*#__PURE__*/ React.createElement("div", { style: { color: "#2196F3", fontWeight: "bold" }, __source: { fileName: "", lineNumber: 618, columnNumber: 19 }, __self: this }, "25%")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 622, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { fontWeight: "bold" }, __source: { fileName: "", lineNumber: 623, columnNumber: 19 }, __self: this }, "Site Prep & Primer"), /*#__PURE__*/ React.createElement("div", { style: { color: "#666", fontSize: "12px" }, __source: { fileName: "", lineNumber: 624, columnNumber: 19 }, __self: this }, "Surface cleaning, primer coat, patching if needed"), /*#__PURE__*/ React.createElement("div", { style: { color: "#2196F3", fontWeight: "bold" }, __source: { fileName: "", lineNumber: 627, columnNumber: 19 }, __self: this }, "10%")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 631, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { fontWeight: "bold" }, __source: { fileName: "", lineNumber: 632, columnNumber: 19 }, __self: this }, "Overheads & Margin"), /*#__PURE__*/ React.createElement("div", { style: { color: "#666", fontSize: "12px" }, __source: { fileName: "", lineNumber: 633, columnNumber: 19 }, __self: this }, "Tools, insurance, travel, admin, profit buffer"), /*#__PURE__*/ React.createElement("div", { style: { color: "#2196F3", fontWeight: "bold" }, __source: { fileName: "", lineNumber: 636, columnNumber: 19 }, __self: this }, "10%")))), showVariationInfo && /*#__PURE__*/ React.createElement("div", { style: { backgroundColor: "white", padding: "15px", borderRadius: "4px", marginTop: "10px", textAlign: "left", fontSize: "14px" }, __source: { fileName: "", lineNumber: 645, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: "10px" }, __source: { fileName: "", lineNumber: 655, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 662, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { style: { margin: "0", paddingLeft: "20px" }, __source: { fileName: "", lineNumber: 663, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 664, columnNumber: 21 }, __self: this }, "Moisture levels"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 665, columnNumber: 21 }, __self: this }, "Site access"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 666, columnNumber: 21 }, __self: this }, "Site size"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 669, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { style: { margin: "0", paddingLeft: "20px" }, __source: { fileName: "", lineNumber: 670, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 671, columnNumber: 21 }, __self: this }, "Surface falls"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 672, columnNumber: 21 }, __self: this }, "Custom logos"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 673, columnNumber: 21 }, __self: this }, "Travel zones"))))), /*#__PURE__*/ React.createElement("div", { style: { marginTop: "20px", borderTop: "1px solid #ddd", paddingTop: "15px" }, __source: { fileName: "", lineNumber: 680, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { style: { fontSize: "14px", color: "#d32f2f", fontWeight: "500", marginBottom: "10px" }, __source: { fileName: "", lineNumber: 687, columnNumber: 13 }, __self: this }, "Limited availability for priority installation this month"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowModal(true), style: { padding: "15px 30px", backgroundColor: "#2196F3", color: "white", border: "none", borderRadius: "4px", cursor: "pointer", fontSize: "18px", fontWeight: "bold", width: "100%", maxWidth: "300px", boxShadow: "0 4px 8px rgba(33,150,243,0.3)", transition: "all 0.2s ease" }, __source: { fileName: "", lineNumber: 697, columnNumber: 13 }, __self: this }, "🔒 Secure This Price Now")), /*#__PURE__*/ React.createElement("div", { style: { display: "flex", justifyContent: "center", alignItems: "center", gap: "8px", marginTop: "15px", fontSize: "13px", color: "#666" }, __source: { fileName: "", lineNumber: 718, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 729, columnNumber: 13 }, __self: this }, "🛡️ Price Protection"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 730, columnNumber: 13 }, __self: this }, "•"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 731, columnNumber: 13 }, __self: this }, "🏃 Fast Installation"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 732, columnNumber: 13 }, __self: this }, "•"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 733, columnNumber: 13 }, __self: this }, "💯 Satisfaction Guaranteed")), /*#__PURE__*/ React.createElement("p", { style: { fontSize: "12px", color: "#666", fontStyle: "italic", marginTop: "15px" }, __source: { fileName: "", lineNumber: 736, columnNumber: 11 }, __self: this }, "Note: All prices are estimates and subject to change", /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 745, columnNumber: 13 }, __self: this }), "Final quote issued after site inspection or photo pack")), showModal && ModalContent)); }