TextField mui - How to change startAdornment color when hovering over TextField

My TextField element that changes border color on hover as of now:

<TextField
            variant="outlined"
            placeholder={placeholder}
            InputProps={{
                startAdornment: (
                    <InputAdornment position="start">
                        <SearchIcon />
                    </InputAdornment>
                ),
                endAdornment: (
                    <IconButton position="end" sx={{ "&:hover": { color: "#00AAA7" } }}>
                        <CloseIcon />
                    </IconButton>
                ),
            }}
            sx={{
                '& .MuiOutlinedInput-root': {
                    borderRadius: '30px',
                    '&:hover fieldset': {
                        borderColor: '#00AAA7',
                      },
                },
            }}
        />

I also want to change color of [startAdornment] i.e. nothing but an Icon when hovered on root. How to do it? Please help!

You can change the color of startAdornment when the root is hovered by adding style to .MuiInputAdornment-positionStart class like this:

'&:hover .MuiInputAdornment-positionStart': {
    color: '#00AAA7',
},

You can take a look at this StackBlitz for a live working example of this approach.