How to override css and import with another component in react js

I just trying to override css in react-admin and i have separate override css file (like "styleOverride.js") in folder. i want to use this file to my anothers components.

Simplyfy: how to add override css to another components.

I just show my tried code here.

//styleOverride.js

import { createTheme, ThemeProvider } from "@material-ui/core/styles";

const theme = createTheme({
    overrides: {
      MuiCard: {
        root: {
          overflow: "visible",
          boxShadow: "none",
        },
      },
      MuiButton: {
        root: {
          backgroundColor: "#673AB7",
          color: "#fff !important",
          marginRight: "10px",
          padding: "5px !important",
          "&:hover": {
            backgroundColor: "#B39DDB !important",
          },
        },
        label: {
          fontSize: "11px",
        },
      },
      MuiTableHead: {
        root: {
          fontWeight: "800",
        },
      },
      MuiTableCell: {
        root: {
          padding: "15px !important",
        },
      },
      MuiToolbar: {
        root: {
          padding: "0px !important",
          // marginTop:"15px"
        },
      },
      MuiSvgIcon: {
        root: {
          fontSize: "15px !important",
        },
      },
      RaBulkActionsToolbar: {
        title: {
          marginLeft: "15px",
        },
      },
    },
  });

 export default createTheme

Here is my another component. i want to add override css this component.

//list.js

import createTheme from "./styleOverride";

export const RoleList = (props) => {
  return (
    <ThemeProvider theme={theme}>
      <Card >
        <List {...props} pagination={null} perPage={9999}>
          <Datagrid>
            <TextField source="name" />
            <EditButton />
          </Datagrid>
        </List>
      </Card>
    </ThemeProvider>
  );
};

export const RoleCreate = (props) => {
  return (
    <ThemeProvider theme={theme}>
      <Card>
        <Create {...props}>
          <SimpleForm>
            <TextInput source="name" />
          </SimpleForm>
        </Create>
      </Card>
    </ThemeProvider>
  );
};