diff --git a/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/page.tsx b/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/_page.tsx
similarity index 100%
rename from apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/page.tsx
rename to apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/_page.tsx
diff --git a/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/cancel/page.tsx b/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/cancel/page.tsx
new file mode 100644
index 000000000..7cbfd8aec
--- /dev/null
+++ b/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/cancel/page.tsx
@@ -0,0 +1,29 @@
+import {
+  BookingErrorCodeEnum,
+  PaymentCallbackStatusEnum,
+} from "@/constants/booking"
+import { details } from "@/constants/routes/hotelReservation"
+
+import HandleErrorCallback from "@/components/HotelReservation/EnterDetails/Payment/PaymentCallback/HandleErrorCallback"
+
+import type { LangParams, PageArgs } from "@/types/params"
+
+export default async function PaymentCallbackPage({
+  params,
+}: PageArgs<LangParams>) {
+  console.log(`[payment-callback] cancel callback started`)
+  const lang = params.lang
+
+  const returnUrl = details(lang)
+  const searchObject = new URLSearchParams()
+
+  searchObject.set("errorCode", BookingErrorCodeEnum.TransactionCancelled)
+
+  return (
+    <HandleErrorCallback
+      returnUrl={returnUrl.toString()}
+      searchObject={searchObject}
+      status={PaymentCallbackStatusEnum.Cancel}
+    />
+  )
+}
diff --git a/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/error/page.tsx b/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/error/page.tsx
new file mode 100644
index 000000000..425882235
--- /dev/null
+++ b/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/error/page.tsx
@@ -0,0 +1,67 @@
+import {
+  BookingErrorCodeEnum,
+  PaymentCallbackStatusEnum,
+} from "@/constants/booking"
+import { details } from "@/constants/routes/hotelReservation"
+import { serverClient } from "@/lib/trpc/server"
+
+import HandleErrorCallback from "@/components/HotelReservation/EnterDetails/Payment/PaymentCallback/HandleErrorCallback"
+
+import type { LangParams, PageArgs } from "@/types/params"
+
+export default async function PaymentCallbackPage({
+  params,
+  searchParams,
+}: PageArgs<
+  LangParams,
+  {
+    confirmationNumber?: string
+  }
+>) {
+  console.log(`[payment-callback] error callback started`)
+  const lang = params.lang
+  const confirmationNumber = searchParams.confirmationNumber
+
+  const returnUrl = details(lang)
+  const searchObject = new URLSearchParams()
+
+  let errorMessage = undefined
+
+  if (confirmationNumber) {
+    try {
+      const bookingStatus = await serverClient().booking.status({
+        confirmationNumber,
+      })
+
+      // TODO: how to handle errors for multiple rooms?
+      const error = bookingStatus.errors.find((e) => e.errorCode)
+
+      errorMessage =
+        error?.description ??
+        `No error message found for booking ${confirmationNumber}`
+
+      searchObject.set(
+        "errorCode",
+        error
+          ? error.errorCode.toString()
+          : BookingErrorCodeEnum.TransactionFailed
+      )
+    } catch {
+      console.error(
+        `[payment-callback] failed to get booking status for ${confirmationNumber}`
+      )
+
+      searchObject.set("errorCode", BookingErrorCodeEnum.TransactionFailed)
+      errorMessage = `Failed to get booking status for ${confirmationNumber}`
+    }
+  }
+
+  return (
+    <HandleErrorCallback
+      returnUrl={returnUrl.toString()}
+      searchObject={searchObject}
+      status={PaymentCallbackStatusEnum.Error}
+      errorMessage={errorMessage}
+    />
+  )
+}
diff --git a/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/success/page.tsx b/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/success/page.tsx
new file mode 100644
index 000000000..a25f2a58d
--- /dev/null
+++ b/apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/success/page.tsx
@@ -0,0 +1,33 @@
+import { BOOKING_CONFIRMATION_NUMBER } from "@/constants/booking"
+import { bookingConfirmation } from "@/constants/routes/hotelReservation"
+
+import HandleSuccessCallback from "@/components/HotelReservation/EnterDetails/Payment/PaymentCallback/HandleSuccessCallback"
+
+import type { LangParams, PageArgs } from "@/types/params"
+
+export default async function PaymentCallbackPage({
+  params,
+  searchParams,
+}: PageArgs<
+  LangParams,
+  {
+    confirmationNumber: string
+  }
+>) {
+  console.log(`[payment-callback] success callback started`)
+  const lang = params.lang
+
+  const confirmationNumber = searchParams.confirmationNumber
+
+  const confirmationUrl = `${bookingConfirmation(lang)}?${BOOKING_CONFIRMATION_NUMBER}=${confirmationNumber}`
+  console.log(
+    `[payment-callback] rendering success callback with confirmation number: ${confirmationNumber}`
+  )
+
+  return (
+    <HandleSuccessCallback
+      confirmationNumber={confirmationNumber}
+      successRedirectUrl={confirmationUrl}
+    />
+  )
+}
diff --git a/apps/scandic-web/next.config.js b/apps/scandic-web/next.config.js
index 366e8c017..f6257a0be 100644
--- a/apps/scandic-web/next.config.js
+++ b/apps/scandic-web/next.config.js
@@ -285,11 +285,6 @@ const nextConfig = {
           source: `${myPages.sv}/:path*`,
           destination: `/sv/my-pages/:path*`,
         },
-        {
-          source: "/:lang/hotelreservation/payment-callback/:status",
-          destination:
-            "/:lang/hotelreservation/payment-callback?status=:status",
-        },
         // Find my booking
         {
           source: findMyBooking.en,