С текстовым полем пользовательского интерфейса материала с номером типа, как сделать кнопки прокрутки темнее?

Я создаю числовое текстовое поле с пользовательским интерфейсом материала, и оно не использует мою тему для цветов кнопок прокрутки.

Вот пример кода из документации Material UI и его скриншот на их сайте:

<TextField
  id = "outlined-number"
  label = "Number"
  type = "number"
  InputLabelProps = {{
    shrink: true,
  }}
/>

Вот скриншот из моего приложения React, когда я копирую и вставляю их пример:

Мой воспроизводимый пример кода состоит из двух файлов: App.js и ThemeUtil.js.

Приложение.js:

import React from 'react';

import darkTheme, {lightTheme, ThemeContext} from "./ThemeUtil";
import {Box, CssBaseline, TextField, ThemeProvider} from "@mui/material";

function App() {
  const initialTheme = localStorage.getItem('theme') === 'light' ? lightTheme : darkTheme;

  const [theme, setTheme] = React.useState(initialTheme);

  const toggleTheme = () => {
    setTheme(prevTheme => {
      const newTheme = prevTheme === darkTheme ? lightTheme : darkTheme
      localStorage.setItem('theme', newTheme === darkTheme ? 'dark' : 'light');

      return newTheme;
    });
  }

  return (
      <ThemeContext.Provider value = {{theme, toggleTheme}}>
        <ThemeProvider theme = {theme}>
            <CssBaseline/>
            <Box className = {"TestAppContainer"} sx = {{display: "flex", justifyContent: "center", alignItems: "center", width: "100vw", height: "100vh"}}>
                <TextField
                    label = "Number"
                    type = "number"
                    InputLabelProps = {{
                        shrink: true,
                    }}
                />
            </Box>
        </ThemeProvider>
      </ThemeContext.Provider>
  );
}

export default App;

ThemeUtil.js:

import React from "react";

import {createTheme} from '@mui/material/styles';

const darkTheme = createTheme({
    palette: {
        mode: "dark",
    },
    typography: {
        fontSize: 16,
    },
});

const lightTheme = createTheme({
    palette: {
        mode: "light",
    },
    typography: {
        fontSize: 16,
    },
});

const ThemeContext = React.createContext({
    theme: darkTheme, toggleTheme: () => {
    }
});

export default darkTheme;
export {lightTheme, ThemeContext};

Как сделать кнопки прокрутки темными, как в примере на сайте Material UI? Можно ли изменить тему, чтобы установить для них указанный цвет?