AppChrome: Use canvas bg for topnav

public/app/core/components/AppChrome/AppChrome.tsx

@@ -231,7 +231,7 @@ const getStyles = (theme: GrafanaTheme2, headerLevels: number, headerHeight: num
       zIndex: theme.zIndex.navbarFixed,
       left: 0,
       right: 0,
-      background: theme.colors.background.primary,
+      background: theme.colors.background.canvas,
       flexDirection: 'column',
     }),
     topNavMenuDocked: css({

public/app/core/components/AppChrome/MegaMenu/MegaMenuHeader.tsx

@@ -69,6 +69,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
   header: css({
     alignItems: 'center',
     borderBottom: `1px solid ${theme.colors.border.weak}`,
+    background: theme.colors.background.canvas,
     display: 'flex',
     gap: theme.spacing(1),
     justifyContent: 'space-between',