Mantine Notification Text Color

I am helping my friends develop the frontend of an application, developed in Typescript, React and Mantine. We have the following notification code and image:

Code:

notifications.show({
			id: 'login-success',
			title: 'Login successful!',
			message: 'You have successfully logged in!',
			autoClose: 5000,
			withCloseButton: true,
			style: { backgroundColor: 'green' },
		});

Result:

I want the title and text in the notification to be white.

I tried the following, but none of them worked;

• Changing the style attribute to have the color: 'white' property,

• Adding .mantine-notification-message {
color: white !important;
} to the CSS that we are using and

• Wrapping the entire app using ThemeProvider like so:

     const theme = {
       colorScheme: 'dark',
       colors: {
         white: '#ffffff',
       },
     };
  
     return (
       <ThemeProvider theme={theme}>
         ... components ...
       </ThemeProvider>
     );
  

How can I make the title and the text white?

From the documentation: (https://mantine.dev/others/notifications/#customize-notification-styles), you can use

styles: (theme) => ({
    title: { color: theme.white },
    description: { color: theme.white },
})