How to style active list item MUI5?

I'm just starting to use material ui and having a hard time trying to style the active list item of a sidebar menu. Here's what I've tried so far. What am I missing or doing wrong?

            <>
              <ListItemButton onClick={i.onClick}>
                  <Icon/>
                <ListItemText primary={i.listItemText} />
              </ListItemButton>
              <Collapse in={open} timeout='auto' unmountOnExit>
                <List component='div' disablePadding>
                  {i.nestedItems?.map((n, idx) => (
                    <ListItemButton sx={{ pl: '4.3rem' }}>
                      <ListItemText
                        primary={i.nestedItems[idx]}
                      />
                    </ListItemButton>
                  ))}
                </List>
              </Collapse>
            </>
          ))}

I've tried styling it in them theme like som but it doesn't work:

      styleOverrides: {
        root: {
          "&:focus": {
            fontWeight: baseTheme.typography.fontWeightBold
          },
        },
      },
    }