I add tabs in my project but I can not change the background indicator :

const theme = createTheme({
  MuiTabs: {
      root: {
        styleOverrides: {
          indicator: {backgroundColor: "red !important"},
        },

        indicator: {backgroundColor: "red !important"},

      },
      indicator: {backgroundColor: "red !important"},

      styleOverrides: {
        indicator: {backgroundColor: "red !important"},
      },
    },

})

this is my code but it does not work.

and this is my jsx code it might help :

import {TabContext, TabList, TabPanel} from "@material-ui/lab";
import Box from "@mui/material/Box";
import Tab from "@mui/material/Tab";
<TabContext value={value}>
                    <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
                        <TabList onChange={handleChange} aria-label="lab API tabs example"
                                 textColor="primary"
                                 indicatorColor="primary"

                        >
                            <Tab label="Company Details" value="1" />
                            <Tab label="Admin Details" value="2" />
                        </TabList>
                    </Box>
                    <TabPanel value="1">
                        <FormSimple id={id}/>
                    </TabPanel>
                    <TabPanel value="2"><Admin id={id}/></TabPanel>
                </TabContext>