How to fix appearing position of Bottom Sheet Dialog

Question

In Android 11, BottomSheetDialog (BSD) is appearing like it supposed to, but on older versions its either over Navigation Bar or under it. I've attached pictures of my problem, and this is my xml:

<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/modal_bottom_sheet_background"
    android:backgroundTint="?attr/backgroundColor"
    android:layout_marginStart="16dp"
    android:layout_marginEnd="16dp"
    android:layout_gravity="bottom"
    app:layout_behavior="android.support.design.widget.BottomSheetBehaviorvior"
    >
   

    <androidx.cardview.widget.CardView
        android:id="@+id/fab_tabliceID"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="@dimen/layout_container_margin_start_end_16"
        android:layout_marginTop="32dp"
        android:layout_marginEnd="@dimen/layout_container_margin_start_end_16"
        app:cardCornerRadius="@dimen/card_corner_radius_15"
        app:layout_constraintTop_toTopOf="parent"
        >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:padding="8dp"...

this is when I tried to envelop everything in Coordinator Layout, but it didnt work:

<androidx.coordinatorlayout.widget.CoordinatorLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            xmlns:tools="http://schemas.android.com/tools"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <androidx.constraintlayout.widget.ConstraintLayout

                android:layout_width="match_parent"
                android:layout_height="wrap_content"

                android:layout_marginStart="16dp"
                android:layout_marginEnd="16dp"
                android:background="@drawable/modal_bottom_sheet_background"
                android:backgroundTint="?attr/backgroundColor"
                app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">
                <!--android:background="@android:color/transparent"-->
                <!--android:layout_gravity="bottom"-->

                <androidx.cardview.widget.CardView
                    android:id="@+id/fab_tabliceID"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="@dimen/layout_container_margin_start_end_16"
                    android:layout_marginTop="32dp"
                    android:layout_marginEnd="@dimen/layout_container_margin_start_end_16"
                    app:cardCornerRadius="@dimen/card_corner_radius_15"
                    app:layout_constraintTop_toTopOf="parent">

                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:gravity="center"...

Ofcourse, one of the solutions I thought of was to, in code, check for Android version and then, if needed, add bottom margin but that doesn't look like the right way.