simplest way to customize the datagrid is using sx props. you can check all the available css rules on https://mui.com/api/data-grid/data-grid/#css

to remove datagrid border use .MuiDataGrid-root rule and inside it you can add border properties. I see you have removed column separator too. To do so use .MuiDataGrid-columnSeparator

if you check below code I have prefixed .MuiDataGrid-root with & sign. but haven't added & sign to .MuiDataGrid-columnSeparator. you can open your chrome developer tool and see if the associated CSS rule has any parent class attached to it or not. if it has any you can prefix the rule with &. this way you don't have to write full class rule.

<DataGrid
  ...
  sx={{
    '.MuiDataGrid-columnSeparator': {
      display: 'none',
    },
    '&.MuiDataGrid-root': {
      border: 'none',
    },
  }}
/>

Look at the Material UI Data Grid - Styling Page

https://mui.com/components/data-grid/style/