I can't seem to find a way to edit the parent (wrapper) for react-select. Its index is currently 1. I need to change it to 9991 (Dialog's index is at 999)

classNamePrefix and adding css doesn't work.

menuContainerStyle={{zIndex: 9991}}

doesn't work.

menu: styles => ({
        ...styles,
        backgroundColor: 'rgba(25,25,25,1)',
        marginTop: 0,
        zIndex: 9991
    }),

doesn't work either.

In element:

<div class="css-ehwxqd"><div class=" css-16ettw9-menu"><div class=" css-4ljt47-MenuList"><div class=" css-16za5a0-NoOptionsMessage"><span class="MuiTypography-root MuiTypography-caption">Enter 3 or more letters</span></div></div></div></div>

div with class css-ehwxqd has z-index 1. This class is apparently dynamic and can't be targeted so easily.

I don't want to resort to hacky code. Any help is greatly appreciated.