stacked style - does not override

Attempting to override style as below does not work on mobile. The override styling rule does not gain priority over default one as one can see on the dev tool screen shot below.

The override does appear on desktop, where it is not intended to.

const getMuiTheme = () => createMuiTheme({
overrides: {
MUIDataTableHeadCell: {
root: {
// my overides here, which work fine
},
},
,
MUIDataTableBodyCell: {
root: {
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis',
},
cellStackedSmall: { // **THIS WORKS**
height: '48px',
},
responsiveStackedSmall: { // **THIS WORKS**
height: '48px',
},
},
MUIDataTableBodyRow: { // ** THE ISSUE IS WITH THIS RULE **
responsiveStacked: {
border: 'solid 3px #2d5074',
},
},
},
});

Override on mobile:

Override showing on desktop:


## Expected Behavior

As per the docs, this should override default styles.

## Current Behavior

## Steps to Reproduce (for bugs)

## Your Environment

| Tech | Version |
|--------------|---------|
| Material-UI | "@material-ui/core": "^4.7.0", |
| MUI-datatables | "mui-datatables": "^2.13.0", |
| React | "react": "^16.12.0", |
| browser | Firefox Developer Edition 75.0b5 |
| etc | |