Why is my screen black when I add bottom bar compose?

Question

I made a bottom bar in Kotlin compose, but the screens with the bottom bar appear black. Normally, there should be a white background and I put a text on the screens for testing purposes, because the screen is black, it does not appear on the texts. I couldn't find the problem. Can you help me ? My codes are as follows.

BaseBottomBar

@Composable
fun BaseBottomBar(
    navController: NavHostController,
    content: @Composable (PaddingValues) -> Unit) {

    Scaffold(
        bottomBar = { BottomBar(navController = navController) },
        content = content)
}

@Composable
fun BottomBar(navController: NavHostController) {
    val screens = listOf(
        BottomNavItem.Home,
        BottomNavItem.Plans,
        BottomNavItem.Content,
    )
    val navBackStackEntry by navController.currentBackStackEntryAsState()
    val currentDestination = navBackStackEntry?.destination

    BottomNavigation {
        screens.forEach { screen ->
            AddItem(
                screen = screen,
                currentDestination = currentDestination,
                navController = navController
            )
        }
    }
}

@Composable
fun RowScope.AddItem(
    screen: BottomNavItem,
    currentDestination: NavDestination?,
    navController: NavHostController
) {
    BottomNavigationItem(
        label = {
            Text(text = screen.title)
        },
        icon = {
            Icon(
                imageVector = screen.icon,
                contentDescription = "Navigation Icon"
            )
        },
        selected = currentDestination?.hierarchy?.any {
            it.route == screen.route
        } == true,
        unselectedContentColor = LocalContentColor.current.copy(alpha = ContentAlpha.disabled),
        onClick = {
            navController.navigate(screen.route) {
                popUpTo(navController.graph.findStartDestination().id)
                launchSingleTop = true
            }
        }
    )
}



sealed class BottomNavItem(
    val route: String,
    val title: String,
    val icon: ImageVector
) {
    object Home : BottomNavItem(
        route = BottomBarScreen.HomeScreen.route,
        title = "Home",
        icon = Icons.Default.Home
    )

    object Plans : BottomNavItem(
        route = BottomBarScreen.PlansScreen .route,
        title = "Profile",
        icon = Icons.Default.Person
    )

    object Content : BottomNavItem(
        route = BottomBarScreen.ContentScreen .route,
        title = "Settings",
        icon = Icons.Default.Settings
    )
}

DashBoard

@Composable
fun DashBoard(navController: NavHostController) {


    BaseBottomBar(navController) {
        Text(text = "DASHBOARD")
    }

}

HomeScreen

@Composable
fun HomeScreen (navHostController: NavHostController){
    BaseBottomBar(navController = navHostController) {
        Text(text = "CONTENT")
    }
}