Opgave 8c: bekræftelsesside efter bestilling + responsivt layout-fix

Baseret på brugerens gennemgang af siden i browser:
- Ved succesfuld bestilling omdirigeres brugeren nu til en dedikeret
  GET /bestilling-modtaget i stedet for en inline besked, der skjulte
  vinkataloget — brugeren vil fortsat kunne se hvad de har bestilt.
  Siden gør det eksplicit at bestillingen først er gyldig ved
  modtaget betaling, og linker tilbage til bestillingssiden.
- Rettet et CSS-layoutbug på smalle skærme: flex-basis (sat til
  600px/260px til brug for bredde i to-kolonne-layoutet) blev
  fejlagtigt fortolket som højde, når layoutet skiftede til
  flex-direction: column under 800px, hvilket gav et stort tomt
  mellemrum mellem vinkatalog og sidebar.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

app/routers/public_site.py

@@ -34,3 +34,9 @@ def public_pickup_page(request: Request, session: SessionDep) -> HTMLResponse:
     return templates.TemplateResponse(
         request, "pickup.html", {"route_name": route.name, "meeting_info": route.meeting_info}
     )
+
+
+@router.get("/bestilling-modtaget", response_class=HTMLResponse)
+def public_order_confirmation(request: Request, session: SessionDep) -> HTMLResponse:
+    route = get_route_from_domain(request, session)
+    return templates.TemplateResponse(request, "order_confirmation.html", {"route_name": route.name})

app/static/site.css

@@ -222,6 +222,11 @@ button[type="submit"]:hover {
     flex-direction: column;
   }
 
+  .catalog,
+  .order-sidebar {
+    flex-basis: auto;
+  }
+
   .order-sidebar {
     position: static;
     width: 100%;

app/static/site.js

@@ -81,11 +81,8 @@
           body: JSON.stringify(payload),
         });
         if (response.ok) {
-          orderForm.querySelector(".catalog").hidden = true;
+          window.location.href = "/bestilling-modtaget";
-          orderForm.querySelectorAll(".field-label, .checkbox-label, button[type=submit]").forEach((el) => {
+          return;
-            el.hidden = true;
-          });
-          showMessage(messageEl, "Tak for din bestilling! En kvittering er sendt til din email.", "success");
         } else {
           showMessage(messageEl, await extractErrorDetail(response), "error");
         }

app/templates/order_confirmation.html

@@ -0,0 +1,10 @@
+{% extends "base.html" %}
+{% block title %} — Bestilling modtaget{% endblock %}
+{% block content %}
+  <div class="signup-card">
+    <h1>Tak for din bestilling!</h1>
+    <p>Der er sendt en kvitteringsmail til den oplyste emailadresse med betalingsoplysninger.</p>
+    <p><strong>Bemærk:</strong> bestillingen er først gyldig, når betalingen er modtaget.</p>
+    <p><a href="/">Tilbage til bestilling</a></p>
+  </div>
+{% endblock %}