diff --git a/packages/react-sdk-components/src/samples/Embedded/Header/index.tsx b/packages/react-sdk-components/src/samples/Embedded/Header/index.tsx
index 3820a253..e9a388c9 100644
--- a/packages/react-sdk-components/src/samples/Embedded/Header/index.tsx
+++ b/packages/react-sdk-components/src/samples/Embedded/Header/index.tsx
@@ -3,7 +3,7 @@ import { makeStyles } from '@mui/styles';
 
 const useStyles = makeStyles(theme => ({
   header: {
-    backgroundColor: theme.palette.mode === 'dark' ? 'var(--app-nav-bg)' : theme.palette.background.paper,
+    backgroundColor: theme.headerNav.backgroundColor,
     borderBottom: `1px solid ${theme.palette.divider}`,
     padding: '1rem 0'
   },
@@ -64,10 +64,10 @@ const useStyles = makeStyles(theme => ({
     margin: 0,
     '& a': {
       textDecoration: 'none',
-      color: theme.palette.mode === 'dark' ? 'var(--app-nav-color)' : theme.palette.text.primary,
+      color: theme.headerNav.navLinkColor,
       transition: 'color 0.3s ease',
       '&:hover': {
-        color: theme.palette.mode === 'dark' ? theme.palette.primary.contrastText : theme.palette.primary.main
+        color: theme.headerNav.navLinkHoverColor
       }
     },
     '@media (max-width: 768px)': {
@@ -103,7 +103,7 @@ const useStyles = makeStyles(theme => ({
     cursor: 'pointer',
     zIndex: 1001,
     padding: 0,
-    color: theme.palette.mode === 'dark' ? theme.palette.primary.contrastText : theme.palette.text.primary,
+    color: theme.headerNav.menuToggleColor,
     '@media (max-width: 768px)': {
       display: 'block'
     }
diff --git a/packages/react-sdk-components/src/samples/Embedded/MainScreen/index.tsx b/packages/react-sdk-components/src/samples/Embedded/MainScreen/index.tsx
index f581d6f7..ed04878d 100644
--- a/packages/react-sdk-components/src/samples/Embedded/MainScreen/index.tsx
+++ b/packages/react-sdk-components/src/samples/Embedded/MainScreen/index.tsx
@@ -164,8 +164,8 @@ export default function MainScreen(props) {
     if (!mashupCaseType) {
       const caseTypes = PCore.getEnvironmentInfo()?.environmentInfoObject?.pyCaseTypeList;
       if (caseTypes && caseTypes.length > 0) {
-        //mashupCaseType = caseTypes[0].pyWorkTypeImplementationClassName;
-        mashupCaseType = 'DIXL-MediaCo-Work-PurchasePhone';
+        mashupCaseType = caseTypes[6].pyWorkTypeImplementationClassName;
+        //mashupCaseType = 'DIXL-MediaCo-Work-PurchasePhone';
       }
     }
     let selectedPhoneGUID = '';
diff --git a/packages/react-sdk-components/src/theme.ts b/packages/react-sdk-components/src/theme.ts
index 8dda23bd..68fc12cc 100644
--- a/packages/react-sdk-components/src/theme.ts
+++ b/packages/react-sdk-components/src/theme.ts
@@ -20,6 +20,12 @@ declare module '@mui/styles/defaultTheme' {
       backgroundColor: string;
       topColor: string;
     };
+    headerNav: {
+      backgroundColor: string;
+      navLinkColor: string;
+      navLinkHoverColor: string;
+      menuToggleColor: string;
+    };
     embedded: {
       resolutionTextColor: string;
     };
@@ -145,6 +151,12 @@ const lightTheme = createTheme({
       }
     }
   },
+  headerNav: {
+    backgroundColor: '#ffffff',
+    navLinkColor: 'rgba(0, 0, 0, 0.87)',
+    navLinkHoverColor: '#3f51b5',
+    menuToggleColor: 'rgba(0, 0, 0, 0.87)'
+  },
   actionButtons: {
     primary: {
       backgroundColor: '#cc0f60',
@@ -212,6 +224,12 @@ const darkTheme = createTheme({
       }
     }
   },
+  headerNav: {
+    backgroundColor: 'var(--app-nav-bg)',
+    navLinkColor: 'var(--app-nav-color)',
+    navLinkHoverColor: '#ffffff',
+    menuToggleColor: '#ffffff'
+  },
   actionButtons: {
     primary: {
       backgroundColor: '#C70BB5',