diff --git a/common/core/components/sort/SortableTableHead.tsx b/common/core/components/sort/SortableTableHead.tsx
index e9c89117..18b12345 100644
--- a/common/core/components/sort/SortableTableHead.tsx
+++ b/common/core/components/sort/SortableTableHead.tsx
@@ -1,12 +1,15 @@
 import type { ReactNode, ThHTMLAttributes } from "react";
 import type { SortConfig } from "../../utils";
-import { commonTableHeadClass } from "../../../ui/table";
+import {
+  commonStickyTableHeaderClass,
+  commonTableHeadClass,
+} from "../../../ui/table";
 
 export const sortableTableHeadBaseClassName =
   commonTableHeadClass;
 
 export const sortableTableHeaderClassName =
-  "sticky top-0 z-10 bg-secondary shadow-sm";
+  commonStickyTableHeaderClass;
 
 function SortAscendingIcon() {
   return (
diff --git a/common/ui/table.ts b/common/ui/table.ts
index feafc531..9e9d1780 100644
--- a/common/ui/table.ts
+++ b/common/ui/table.ts
@@ -1,6 +1,9 @@
 export const commonTableWrapperClass = "relative w-full";
 export const commonTableClass = "w-full caption-bottom text-sm";
 export const commonTableHeaderClass = "[&_tr]:border-b";
+export const commonTableHeaderSurfaceClass = "bg-secondary shadow-sm";
+export const commonStickyTableHeaderClass =
+  "sticky top-0 z-10 bg-secondary shadow-sm";
 export const commonTableBodyClass = "[&_tr:last-child]:border-0";
 export const commonTableFooterClass = "bg-muted/50 font-medium text-foreground";
 export const commonTableRowClass =