import { createTheme } from '@mui/material/styles';
export const datePickerTheme = (outerTheme) => createTheme({
    ...outerTheme,
    components: {
        // Keep targeting TextField root in case of any wrappers
        MuiFormControl: {
            styleOverrides: {
                root: {
                    backgroundColor: 'white',
                    border: '1px solid #9D9FA2',
                    borderRadius: '4px',
                    padding: 0,
                    // fix background inheritance in DatePicker wrapper
                    '& .MuiFilledInput-root': {
                        backgroundColor: 'white',
                    },
                    '& .MuiInputBase-input': {
                        // label-medium-1
                        fontSize: '16px',
                        fontWeight: '400',
                        lineHeight: '120%',
                        letterSpacing: '0px',
                        fontFamily: 'Work Sans, sans-serif',
                        '&::placeholder': {
                            color: '#707276',
                        },
                        '&:-webkit-autofill': {
                            WebkitBoxShadow: '0 0 0px 1000px transparent inset !important',
                            WebkitTextFillColor: '#000 !important',
                            transition: 'background-color 5000s ease-in-out 0s', // Prevents flashing
                        },
                    },
                    '& .MuiPickersInputBase-root::before': {
                        content: 'none',
                    },
                    '& .MuiPickersInputBase-root::after': {
                        content: 'none',
                    },
                    '& .MuiPickersInputBase-root': {
                        backgroundColor: 'white',
                        paddingLeft: '4px',
                        height: '100%',
                    },
                    '& .MuiInputLabel-root': {
                        paddingLeft: '4px',
                        color: '#000000',
                        textTransform: 'uppercase',
                        // helper-medium-1
                        fontSize: '12px',
                        fontWeight: '400',
                        lineHeight: '100%',
                        letterSpacing: '0.16px',
                        fontFamily: 'Work Sans, sans-serif',
                    },
                },
            },
        },
    },
});
