Как я могу размыть все, что находится за модальным окном? filter: blur (1px) размывает все, включая модальное

Question

Я пробовал эти коды в CSS (SASS), но они не работают. Они размывают все, в том числе модальное. Я просто хочу размыть фон, когда модальное окно открыто. Что мне делать?

.modal-open
    overflow: hidden

    &:not(.modal)
        filter: blur(2px)

или это

.modal-open
    overflow: hidden
    filter: blur(2px)

или это

.modal-open:not(.modal)
    filter: blur(2px)

JS (React):

if (this.state.showModalSuz) {
            document.body.classList.add('modal-open');
        }
        if (!this.state.showModalSuz) {
            document.body.classList.remove('modal-open');
        }