I want to expand Material3 Scaffold’s content to TopBar, but the top bar should not be overlap with sticky TabRow header from content body when scrolling down

Currently LazyColumn has top padding 0.dp, so the LazyColumn will expand to TopBar. When scrolling down LazyColumn, the TabRow will be at top of screen not below TopBar

Kotlin Code:

@OptIn(ExperimentalFoundationApi::class, ExperimentalMaterial3Api::class)
@Composable
fun ProfileScreen() {
    var selectedTabIndex by remember { mutableIntStateOf(0) }
    val tabTitles = listOf("About", "Moments")

    Scaffold(
        topBar = {
            TopAppBar(
                title = {},
                navigationIcon = {
                    IconButton(onClick = { }) {
                        Icon(
                            imageVector = Icons.Filled.ArrowBack,
                            contentDescription = "Back"
                        )
                    }
                },
                colors = topAppBarColors(
                    containerColor = Color.Transparent,
                    scrolledContainerColor = Color.Transparent
                ),
                scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior()
            )

        },
        bottomBar = {
            Divider(modifier = Modifier.clip(RoundedCornerShape(20.dp)))
            Button(
                onClick = {}, modifier = Modifier
                    .fillMaxWidth()
                    .padding(20.dp)
            ) {
                Text("Edit profile")
            }
        }
    ) { paddingValue ->
        LazyColumn(
            modifier = Modifier
                .fillMaxSize()
                .padding(
                    top = 0.dp,
                    bottom = paddingValue.calculateBottomPadding()
                )
                .background(onBackgroundDark)
        ) {
            item {
                HeaderBackground()
            }

            item {
                ProfileUserSection()
            }

            stickyHeader {
                ScrollableTabRow(
                    selectedTabIndex = selectedTabIndex,
                    modifier = Modifier
                        .padding(10.dp, 0.dp, 10.dp, 0.dp)
                        .fillMaxWidth()
                        .clip(RoundedCornerShape(20.dp, 20.dp, 0.dp, 0.dp)),
                    edgePadding = 0.dp,
                    divider = {}
                ) {
                    tabTitles.forEachIndexed { index, title ->
                        Tab(selected = selectedTabIndex == index,
                            onClick = { selectedTabIndex = index },
                            text = { Text(title) })
                    }
                }
            }

            item {
                when (selectedTabIndex) {
                    0 -> TabAbout()
                    1 -> TabMoments()
                }
            }
        }
    }
}