React material-table: How can I override the style of title in material-table?

Question

I am using material-table "https://material-table.com/"

This is my component that renders a table of data. Here, I am using a custom button inside title for adding new data. It is inside title so that the button goes on the top-left side. I am not using the default add option given by material-table because I want to display a separate form page for adding data instead of inline-adding given by material-table. It works perfectly.

The problem is that the default styling of title has overflow:hidden which can be seen by inspecting it.
<div class='MTableToolbar-title-35'>.... </div>

I want this overflow:hidden to be overflow:auto . How can I override the styling of this title?

 export const EmployeeView = ({columns,data}) => {
        return (
          <div>
            <MaterialTable
              columns={columns}
              data={data}
              title={
                <div>
                  <IconButton size='small' color='primary' onClick={() => console.log("Add employee")}>
                      <AddCircleIcon />
                  </IconButton>
                </div>
              }
              onRowClick={(event,rowData) => console.log(rowData)}
            />
          </div>
        )
      
    }

Answer 1

Please use this in the css file

.MuiTypography-h6{
    font-size: 1rem;
    color: red;
    overflow:auto
}

I mentioned the color and font size for testing.