fix: [LM-4143] Render AppBar bottom border instead of full box border

packages/ui/src/app-bar/AppBarOverrides.ts

@@ -1,3 +1,4 @@
+import { ColorDynamic } from '../theme/Color';
 import { SuperDispatchTheme } from '../theme/SuperDispatchTheme';
 
 export function overrideAppBar(theme: SuperDispatchTheme): void {
@@ -6,4 +7,13 @@ export function overrideAppBar(theme: SuperDispatchTheme): void {
     color: 'inherit',
     position: 'static',
   };
+
+  theme.overrides.MuiAppBar = {
+    root: {
+      '&.MuiPaper-elevation0': {
+        border: 'none',
+        borderBottom: `1px solid ${ColorDynamic.Silver400}`,
+      },
+    },
+  };
 }

packages/ui/src/app-bar/__tests__/AppBar.spec.tsx

@@ -13,6 +13,15 @@ it('checks default props', () => {
   `);
 });
 
+it('renders a bottom border instead of the inherited full box border', () => {
+  // eslint-disable-next-line testing-library/render-result-naming-convention -- renderCSS returns a CSS string, not an RTL render result
+  const css = renderCSS(<AppBar />, ['MuiAppBar']);
+
+  expect(css).toContain('.MuiAppBar-root.MuiPaper-elevation0');
+  expect(css).toContain('border: none');
+  expect(css).toContain('border-bottom: 1px solid ColorDynamic.Silver400');
+});
+
 it('checks component css', () => {
   expect(renderCSS(<AppBar />, ['MuiAppBar'])).toMatchInlineSnapshot(`
     .MuiAppBar-root {
@@ -24,6 +33,11 @@ it('checks component css', () => {
       flex-direction: column;
     }
 
+    .MuiAppBar-root.MuiPaper-elevation0 {
+      border: none;
+      border-bottom: 1px solid ColorDynamic.Silver400;
+    }
+
     .MuiAppBar-positionFixed {
       top: 0;
       left: auto;

packages/ui/src/drawer/DrawerActions.tsx

@@ -12,6 +12,7 @@ const useStyles = makeStyles(
       '&&': {
         bottom: 0,
         top: 'auto',
+        borderTop: `1px solid ${ColorDynamic.Silver400}`,
         borderLeft: 'none',
         borderRight: 'none',
         borderBottom: 'none',

packages/ui/src/drawer/__tests__/Drawer.spec.tsx

@@ -15,6 +15,15 @@ it('checks default props', () => {
   `);
 });
 
+it('DrawerActions declares its own top border rather than the inherited box border', () => {
+  // eslint-disable-next-line testing-library/render-result-naming-convention -- renderCSS returns a CSS string, not an RTL render result
+  const css = renderCSS(<DrawerActions />, ['SD-DrawerActions']);
+
+  // AppBar no longer ships a full box border, so the action bar must own its
+  // top divider explicitly (width + style), toggling only the color on sticky.
+  expect(css).toContain('border-top: 1px solid ColorDynamic.Silver400');
+});
+
 it('checks component css', () => {
   expect(
     renderCSS(
@@ -106,6 +115,7 @@ it('checks component css', () => {
     .SD-DrawerActions-appBar.SD-DrawerActions-appBar {
       top: auto;
       bottom: 0;
+      border-top: 1px solid ColorDynamic.Silver400;
       transition: border-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
       border-left: none;
       border-right: none;