In Ag grid react version 33.2.x, custom styles not reflected

I am using ag grid react version 33.2.4. I have a valid license key for enterprise version. I have customised some styles using themeQuartz but the styles are not reflected.

import { AgGridReact } from 'ag-grid-react';
import { themeQuartz } from 'ag-grid-community';
import 'ag-grid-community/styles/ag-grid.css';

// Define your custom theme 
const myTheme = themeQuartz.withParams({
  accentColor: "#0071E9",
  backgroundColor: "#FFFFFF",
  borderColor: "#C5DAF1",
  borderRadius: 0,
  browserColorScheme: "inherit",
  cellTextColor: "#323A3E"
});

const MyCustomThemedGrid = () => {
  const gridRef = useRef(null);
  const [columnDefs] = useState([
    { headerName: 'Make', field: 'make' },
    { headerName: 'Model', field: 'model' },
    { headerName: 'Price', field: 'price' },
  ]);
  const [rowData] = useState([
    { make: 'Toyota', model: 'Celica', price: 35000 },
    { make: 'Ford', model: 'Mondeo', price: 32000 },
    { make: 'Porsche', model: 'Boxster', price: 72000 },
  ]);

  const onGridReady = useCallback((params) => {
    gridRef.current.api = params.api;
  }, []);

 return (
    <div style={{ height: 300, width: 600 }}>
      <AgGridReact
        ref={gridRef}
        columnDefs={columnDefs}
        rowData={rowData}
        theme={myTheme} 
        onGridReady={onGridReady}
      />
    </div>
  );
};

export default MyCustomThemedGrid;

package.json

"dependencies" : {
"ag-grid-react": "33.2.4",
"ag-grid-community" : "33.2.4",
"ag-grid-enterprise" : "33.2.4"
}

I have tried adding the theme in gridOptions as well.

Add these to your code

const theme = useMemo<Theme | "legacy">(() => {
    return myTheme;
}, []);

and use it in your grid like,

<AgGridReact
    ref={gridRef}
    columnDefs={columnDefs}
    rowData={rowData}
    theme={theme} 
    onGridReady={onGridReady}
/>

Documentation: React Grid - Theme Parameters