// Variables
$modal-dialog-background-color: $color-layer-1;
$modal-dialog-border-color: $modal-border-color;

.dbq-modal-dialog-backdrop {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    overflow-y: auto;
    padding: $padding-default 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1039; // This is 1 above the DbqPopup z-index
    //background: rgba(0, 0, 0, 0.8);
    background: rgba(6, 22, 42, 0.3);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
    @include scrollbar;

    .dbq-modal-dialog {
        width: 100%;
        border-radius: $border-radius-default;

        .dbqmd-dialog {
            .dbqmd-content {
                border: none;
                border-radius: $border-radius-default;
                background-color: $modal-dialog-background-color;
                color: $text-color-default;

                .dbqmd-header {
                    font-size: $font-size-base;

                    .dbqmd-title {

                    }
                }

                .dbqmd-body {
                    background-color: $modal-dialog-background-color;
                }

                .dbqmd-footer {
                    border-top-color: $modal-dialog-border-color;
                }
            }
        }
    }   
}