MUI X Date and Time Picker theme

MUI X Date Picker is using the default theme instead of using my custom theme. How to correct this and make the picker to use my custom theme instead of default one.

Code Sandbox code

Please put whatever you have tried in the question. Anyway, You can define your own theme in the index.js file.

const theme = createMuiTheme({
    palette: {
        primary: {
            main: "#008080"
        },
        secondary: {
            main: '#4caf50',
        },

    }
})

ReactDOM.render(
        <MuiThemeProvider theme={theme}>
            <App />
        </MuiThemeProvider>,
    document.getElementById('root')
);

It will now pick the theme you have here.

Here is the exact code that is working like I said.

<MuiPickersUtilsProvider
  libInstance={moment}
  utils={MomentUtils}>
  <KeyboardDateTimePicker
     autoOk
     fullWidth
     size="small"
     animateYearScrolling
     inputVariant="outlined"
     value={start_time}
     keyboardIcon={<DateRangeIcon color="secondary" />}
     placeholder={showStartTime ? "" : "Test not scheduled"}
     onChange={handleDateChange} />
</MuiPickersUtilsProvider>