Widget not updating its colorScheme with global ThemeData

Question

The app app here loads a tabbed simple app with a scaffold, app bar, and bottomNavigationBar which is set as a TabBar.

When set at the bottomNavigationBar, the TabBar becomes white so I've overridden its background color using a Container widget.

While the rest of my app will change its color palette as expected, however it doesn't for my TabBar. Using Theme.of(context) to get the primary color doesn't work either, as the Theme's color scheme doesn't seem to change at all.

I've attached pictures of the problem too.

theme: ThemeData.light()

theme: ThemeData.dark()

Notice how the whole app except the bottom TabBar reflects these changes happily.

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Sereal',
        theme: ThemeData(primarySwatch: Colors.indigo),
        home: DefaultTabController(
          length: 3,
          child: Scaffold(
              appBar: AppBar(
                title: const Text('App'),
              ),
              bottomNavigationBar: Container(
                color: Theme.of(context).primaryColor,
                child: const TabBar(
                  tabs: <Widget>[
                    Tab(
                      icon: Icon(Icons.calendar_today),
                      text: 'Planner',
                    ),
                    Tab(
                      icon: Icon(Icons.amp_stories),
                      text: 'Cards',
                    ),
                    Tab(
                      icon: Icon(Icons.auto_stories),
                      text: 'Notes',
                    ),
                  ],
                ),
              ),
              body: const TabBarView(
                children: <Widget>[CardsView(), NotesView(), PlannerView()],
              )),
        ));
  }
}