The image will best describe this:

code sandbox:https://codesandbox.io/s/annoying-stylesheet-2gpejc?file=/public/index.html

You can see some styles were removed (for 'code' element for example), but not all the styles(MUI TextInput Component)

I'm writing React app inside non react app and their styles interfere with my React app styles.

How do I overwrite bootstrap-enterprise.css stylesheet only for the region of my React app without overriding the style rest for the rest of the page (The top app bar is theirs)

.App {
  all: revert;
}

worked initially, but then I tried it my real usecase (overrding Mui Textfield styling component) and it didn't.