Add favicon and apple-touch-icon to multiple HTML files; implement toast notification feature in app.js; update duration mode handling; enhance footer navigation and styling; create AGB and Mietbedingungen pages; improve Nginx configuration for HTML file handling; add logo images.

frontend/app.js

@@ -52,7 +52,7 @@ const bpfSubmitBtn = document.querySelector("#bpfSubmit");
 const bpfSidebar = document.querySelector("#bpfSidebar");
 const bpfSidebarContent = document.querySelector("#bpfSidebarContent");
 const bpfSidebarPlaceholder = document.querySelector(".bpf-sidebar-placeholder");
-let bpfDurationMode = "custom"; // "day" | "weekend" | "custom"
+let bpfDurationMode = ""; // "day" | "weekend" | "custom" | ""
 let bpfSubmitting = false;
 
 function formatYmdLocal(d) {
@@ -96,6 +96,17 @@ const today = formatYmdLocal(new Date());
 
 document.querySelector("#year").textContent = new Date().getFullYear();
 
+// ----------------Toast Notification ----------------
+function showToast(message, duration = 3000) {
+    const toast = document.querySelector("#toast");
+    if (!toast) return;
+    toast.textContent = message;
+    toast.classList.add("show");
+    setTimeout(() => {
+        toast.classList.remove("show");
+    }, duration);
+}
+
 // ---------------- Vehicles ----------------
 async function loadVehicles() {
     const { data, error } = await supabase
@@ -287,7 +298,7 @@ bpfFileIncome.addEventListener("change", () => {
 
 // ---------------- Duration Presets ----------------
 function setDurationMode(mode) {
-    bpfDurationMode = mode;
+    bpfDurationMode = mode || "";
     document.querySelectorAll(".bpf-preset").forEach(b => b.classList.toggle("active", b.dataset.preset === mode));
     document.querySelector("#bpfDateDay").style.display = mode === "day" ? "block" : "none";
     document.querySelector("#bpfDateWeekend").style.display = mode === "weekend" ? "block" : "none";
@@ -295,6 +306,9 @@ function setDurationMode(mode) {
     updateSidebar();
 }
 
+// Fresh page load: no duration selected, so no date inputs are visible.
+setDurationMode("");
+
 document.querySelectorAll(".bpf-preset").forEach(btn => {
     btn.addEventListener("click", () => setDurationMode(btn.dataset.preset));
 });
@@ -452,7 +466,8 @@ document.querySelector("#bpfSubmit").addEventListener("click", async () => {
     await Promise.all(uploads);
 
     bookingFeedback.className = "form-feedback";
-    bookingFeedback.textContent = t("bookingSuccess");
+    bookingFeedback.textContent = "";
+    showToast(t("bookingSuccess"), 4000);
     showBpfStep(1);
     bpfCar.value = "";
     bpfFrom.value = "";
@@ -465,7 +480,7 @@ document.querySelector("#bpfSubmit").addEventListener("click", async () => {
     bpfMessage.value = "";
     document.querySelector("#bpfFileIdName").textContent = "";
     document.querySelector("#bpfFileIncomeName").textContent = "";
-    setDurationMode("custom");
+    setDurationMode("");
     updateSidebar();
     bpfSubmitting = false;
     if (bpfSubmitBtn) bpfSubmitBtn.disabled = false;