"@mui/material": "^5.5.3"

Hola, estoy tratando de diseñar mi formulario MUI usando valores, importados de las variables SCSS. Todo parece funcionar bien (puedo ver los valores pasados en las herramientas de desarrollo), excepto que los colores en realidad nunca cambian.

Registro.tsx

 import {AppDataContext} from './context/app-data-context'; import {createTheme, ThemeProvider} from '@mui/material/styles'; export const Registration = () => { const appData = useContext(AppDataContext); const myTheme = useMemo(() => { const colors = appData.brandedSCSS.default; return createTheme({ palette: { primary: { main: colors.primary // #fdab0a }, secondary: { main: colors.secondary // #ffffff } } }) }, [appData]) return ( <ThemeProvider theme={myTheme}> // some code here </ThemeProvider> );

En algún lugar bajando el árbol de componentes:

 import {Button, CircularProgress, Grid} from "@mui/material"; // some code here return ( //some code there <Button color="primary" type="submit" > )

El tema parece estar aplicado correctamente

pero los botones siguen siendo azules

¿Qué estoy haciendo mal? Gracias.