How to change the border Bottom of Material-UI <Autocomplete/> if is disable

Question

I would like to change the appearance of the autocomplete component provided by MaterialUi when it is disabled. They propose, I imagine, borderBottom: dotted. I would like it to look like the select, also disabled, that I show in the following example.

https://codesandbox.io/s/xenodochial-shtern-7icn9?file=/src/playground.js

I don't know how is the correct way to overwrite the property proposed by MaterialUi. Any ideas will be welcome.

Answer 1

Add in your main css (for overwrite a rule it must be imported after mui):

.MuiInput-underline.Mui-disabled:before {
  border-bottom: 0;
}