AnimatedVisibility doing weried behaviour when using Spacebetween in column

Question

I want to use verticalArrangement = Arrangement.SpaceBetween in Column to align view top and bottom. I did this before without any problem. Now I added AnimatedVisibility to look good animation when my condition true. But It overlapping the view. I can't understand that things.

PairContentStateLess

@Composable
fun PairContentStateLess(
    viewModel: XyzPairViewModel,
    scanning: State<Boolean>,
    onResume: () -> Unit,
    onPause: () -> Unit,
    tryAgainAction: () -> Unit,
    openSettingAction: () -> Unit,
    onResumeScan: () -> Unit,
    onPauseScan: () -> Unit,
) {
    AnimatedVisibility(visible = true) {
        AppBarScaffold() {
            Column(
                modifier = Modifier
                    .padding(10.dp)
                    .fillMaxSize()
                    .verticalScroll(rememberScrollState()),
                horizontalAlignment = Alignment.CenterHorizontally,
                verticalArrangement = if (viewModel.isBluetoothEnabled && scanning.value) {
                    Arrangement.Top
                } else {
                    Arrangement.SpaceBetween
                }
            ) {
                PairScreenImage()
                PairDeviceDescription()
                if (viewModel.isBluetoothEnabled) {
                    PressAndHoldDescription()
                    WaitingToPair(scanning.value)
                    UnableToPair(scanning.value)
                } else {
                    BluetoothTurnOnWarning()
                    Spacer(modifier = Modifier.weight(1f))
                    TryAgainButtonView { tryAgainAction() }
                    OpenDeviceSettingsButtonView { openSettingAction() }
                }
            }
        }
    }
}

I am only adding UnableToPair code now. If I am using it working fine without any problem.

UnableToPair

fun ColumnScope.UnableToPair(scanning: Boolean) {
    if (!scanning) {
        WarningBoxView()
        Spacer(modifier = Modifier.weight(1f))
        TryAgainButtonView {

        }
    }
}

UI look like this

Now main problems come

when I tried to use AnimatedVisibility. I don't know what happened in the WarningBoxView and TryAgainButtonView.

@Composable
fun ColumnScope.UnableToPair(scanning: Boolean) {
   AnimatedVisibility (!scanning) {
        WarningBoxView()
        Spacer(modifier = Modifier.weight(1f))
        TryAgainButtonView {

        }
    }
}

UI look like this and I hide sensitive data from black box in image. Please notice only button and warning box.

Thanks