fix(frontend): prevent catalog header overlap

frontend/e2e/database-management-layout.spec.ts

@@ -603,18 +603,28 @@ test("context panels stay inside the manager and the Tables grid sits in a sideb
       const rect = node.getBoundingClientRect();
       return rect.top + rect.height / 2;
     };
+    const verticalBounds = (node: Element) => {
+      const rect = node.getBoundingClientRect();
+      return { top: rect.top, bottom: rect.bottom };
+    };
     return {
       backgroundImage: getComputedStyle(element).backgroundImage,
       height: element.getBoundingClientRect().height,
-      centers: [centerY(title), centerY(status), centerY(actions)],
+      primaryCenters: [centerY(title), centerY(actions)],
+      heading: verticalBounds(title),
+      status: verticalBounds(status),
+      actions: verticalBounds(actions),
     };
   });
 
   expect(applicationBarLayout.backgroundImage).toBe("none");
-  expect(applicationBarLayout.height).toBeLessThanOrEqual(72);
+  expect(applicationBarLayout.height).toBeLessThanOrEqual(104);
   expect(
-    Math.max(...applicationBarLayout.centers) - Math.min(...applicationBarLayout.centers),
+    Math.max(...applicationBarLayout.primaryCenters) - Math.min(...applicationBarLayout.primaryCenters),
   ).toBeLessThanOrEqual(1);
+  expect(applicationBarLayout.status.top).toBeGreaterThanOrEqual(
+    Math.max(applicationBarLayout.heading.bottom, applicationBarLayout.actions.bottom) + 8,
+  );
 
   await expect(page.getByRole("row", { name: /patients/ })).toBeVisible();
 

frontend/src/shell/database-management/FleetLedgerShell.css

@@ -838,14 +838,6 @@
   }
 }
 
-@container fleet-workspace (min-width: 82rem) {
-  .thot-fleet-ledger__header {
-    grid-template-areas: "heading status actions";
-    grid-template-columns: max-content minmax(0, 1fr) max-content;
-    row-gap: 0;
-  }
-}
-
 @container fleet-workspace (max-width: 47.999rem) {
   .thot-fleet-ledger__header {
     grid-template-areas: