diff --git a/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx b/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
index 7a004816b..e49250e87 100644
--- a/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
@@ -146,6 +146,8 @@ const BookingInfo = ({ record }: { record: FirstMileRecord }) => (
         <InfoRow label="Phone" value={contactPhone(record)} />
         <InfoRow label="Requested date" value={requestedDate(record)} />
         <InfoRow label="Assigned vehicle" value={vehicleLabel(record) ?? "—"} />
+        <InfoRow label="Est. Distance (KM)" value={record.estimatedKm != null ? String(record.estimatedKm) : "—"} />
+        <InfoRow label="Actual Distance (KM)" value={record.exactKm != null ? String(record.exactKm) : "—"} />
       </SimpleGrid>
     </Stack>
   </Card>
@@ -645,6 +647,18 @@ const FirstMilePage = () => {
         meta: { headerClassName, cellClassName },
         cell: ({ row }) => vehicleLabel(row.original) ?? <Text c="dimmed">—</Text>,
       },
+      {
+        id: "estimatedKm",
+        header: "Est. Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.estimatedKm != null ? row.original.estimatedKm : <Text c="dimmed">—</Text>,
+      },
+      {
+        id: "exactKm",
+        header: "Actual Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.exactKm != null ? row.original.exactKm : <Text c="dimmed">—</Text>,
+      },
       {
         id: "status",
         header: "Status",
diff --git a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
index bb121ddfc..51d1e3a8e 100644
--- a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
@@ -133,11 +133,14 @@ const BookingInfo = ({ record }: { record: LastMileRecord }) => (
         <InfoRow label="Origin yard" value={originYardName(record)} />
         <InfoRow label="Destination" value={deliveryLocation(record)} />
         <InfoRow label="Cargo" value={cargoDesc(record)} />
-        <InfoRow label="Price" value={formatPrice(priceAmount(record))} />
+        <InfoRow label="Advanced Payment" value={formatPrice(record.advancedPayment)} />
+        <InfoRow label="Post Payment" value={formatPrice(record.remainingPayment)} />
         <InfoRow label="Contact" value={contactPersonName(record)} />
         <InfoRow label="Phone" value={contactPhone(record)} />
         <InfoRow label="Requested date" value={requestedDate(record)} />
         <InfoRow label="Assigned vehicle" value={vehicleLabel(record) ?? "—"} />
+        <InfoRow label="Est. Distance (KM)" value={record.estimatedKm != null ? String(record.estimatedKm) : "—"} />
+        <InfoRow label="Actual Distance (KM)" value={record.exactKm != null ? String(record.exactKm) : "—"} />
       </SimpleGrid>
     </Stack>
   </Card>
@@ -149,7 +152,8 @@ const tripSlipRows = (record: LastMileRecord): [string, string][] => [
   ["Origin yard", originYardName(record)],
   ["Destination", deliveryLocation(record)],
   ["Cargo", cargoDesc(record)],
-  ["Price", formatPrice(priceAmount(record))],
+  ["Advanced Payment", formatPrice(record.advancedPayment)],
+  ["Post Payment", formatPrice(record.remainingPayment)],
   ["Vehicle", vehicleLabel(record) ?? "Unassigned"],
   ["Contact", `${contactPersonName(record)} · ${contactPhone(record)}`],
   ["Requested date", requestedDate(record)],
@@ -600,10 +604,16 @@ const LastMilePage = () => {
         cell: ({ row }) => cargoDesc(row.original),
       },
       {
-        id: "price",
-        header: "Price",
+        id: "advancedPayment",
+        header: "Advanced Payment",
         meta: { headerClassName, cellClassName },
-        cell: ({ row }) => formatPrice(priceAmount(row.original)),
+        cell: ({ row }) => formatPrice(row.original.advancedPayment),
+      },
+      {
+        id: "postPayment",
+        header: "Post Payment",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => formatPrice(row.original.remainingPayment),
       },
       {
         id: "vehicle",
@@ -611,6 +621,18 @@ const LastMilePage = () => {
         meta: { headerClassName, cellClassName },
         cell: ({ row }) => vehicleLabel(row.original) ?? <Text c="dimmed">—</Text>,
       },
+      {
+        id: "estimatedKm",
+        header: "Est. Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.estimatedKm != null ? row.original.estimatedKm : <Text c="dimmed">—</Text>,
+      },
+      {
+        id: "exactKm",
+        header: "Actual Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.exactKm != null ? row.original.exactKm : <Text c="dimmed">—</Text>,
+      },
       {
         id: "status",
         header: "Status",
diff --git a/apps/edr-freight-web/backoffice/src/services/first-mile.service.ts b/apps/edr-freight-web/backoffice/src/services/first-mile.service.ts
index 23f5261c8..b182a16d0 100644
--- a/apps/edr-freight-web/backoffice/src/services/first-mile.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/first-mile.service.ts
@@ -60,7 +60,7 @@ export const firstMileService = {
   list: (pageSize = 1000) =>
     api.get<FirstMileListResponse>(`${FM.BASE}?pageSize=${pageSize}`),
   getById: (id: string) => api.get<FirstMileRecord>(FM.BY_ID(id)),
-  update: (id: string, data: { status?: FirstMileApiStatus; vehicleId?: string | null }) =>
+  update: (id: string, data: { status?: FirstMileApiStatus; vehicleId?: string | null; estimatedKm?: number | null; exactKm?: number | null }) =>
     api.patch<FirstMileRecord>(FM.BY_ID(id), data),
   accept: (bookingReference: string) =>
     api.post<FirstMileRecord>(FM.ACCEPT(bookingReference)),
diff --git a/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts b/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
index 779fd96aa..3b7b86e47 100644
--- a/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
@@ -60,7 +60,7 @@ export const lastMileService = {
   list: (pageSize = 1000) =>
     api.get<LastMileListResponse>(`${LM.BASE}?pageSize=${pageSize}`),
   getById: (id: string) => api.get<LastMileRecord>(LM.BY_ID(id)),
-  update: (id: string, data: { status?: LastMileApiStatus; vehicleId?: string | null }) =>
+  update: (id: string, data: { status?: LastMileApiStatus; vehicleId?: string | null; estimatedKm?: number | null; exactKm?: number | null }) =>
     api.patch<LastMileRecord>(LM.BY_ID(id), data),
   accept: (bookingReference: string) =>
     api.post<LastMileRecord>(LM.ACCEPT(encodeURIComponent(bookingReference))),