How to Change Background Color of TabBar Without Changing the AppBar in Flutter?

Code:

class HomePage extends StatelessWidget {
 const HomePage({super.key});
 @override
 Widget build(BuildContext context) {
   return DefaultTabController(
     length: 3,
     child: Scaffold(
       appBar: AppBar(
         title: const Text("TabBar Background Color"),
         /// Only change the AppBar background color
         backgroundColor: Colors.blue,
         bottom: PreferredSize(
           preferredSize: const Size.fromHeight(48.0),
           child: Container(
             color: Colors.green,
             /// Set the TabBar background color
             child: const TabBar(
               labelColor: Colors.white,
               unselectedLabelColor: Colors.black,
               indicatorColor: Colors.yellow,

               /// Set indicator color if needed
               tabs: [
                 Tab(text: "Tab 1"),
                 Tab(text: "Tab 2"),
                 Tab(text: "Tab 3"),
               ],
             ),
           ),
         ),
       ),
       body: const TabBarView(
         children: [
           Center(child: Text("Tab 1 Content")),
           Center(child: Text("Tab 2 Content")),
           Center(child: Text("Tab 3 Content")),
         ],
       ),
     ),
   );
 }
}

Output: