2 modals - how to manage visibility

[GM_sql]

Dear Gsap users,
I realize that similar topis was raised several times, but seems I need more guidance. I have 2 modals, one over another. The question is how to set visibility (visible / hidden) in order to have an access to both of them. As for me, seems visibility is the solution. AutoAlpha doesn't work in my case. JS describes animation and setting for the "menu_container"; exactly the same code applies to "cookie_container".
 

.menu_container {
    width: 100vw;
    max-width: var(--screen_width);
    height: 100vh;
    overflow: hidden;
    position: absolute;
    visibility: hidden;
}

.cookie_container {
    width: 100vw;
    max-width: var(--screen_width);
    height: 100vh;
    overflow: hidden;
    position: absolute;
    visibility: hidden;
}

 

function showMenuModal(e) {
    headerGlobal.classList.add("freeze");
    playMenu.play();
};

function hideMenuModal(e) {
    headerGlobal.classList.remove("freeze");
    playMenu.reverse();
};

openMenuBtn.addEventListener("click", showMenuModal);
closeMenuBtn.addEventListener("click", hideMenuModal);

const playMenu = gsap.timeline({paused: true})
                      .to("menu_container", {autoAlpha: 1})
                      .to(".menu_outer_modal", {opacity: 1})
                      .from(".menu_outer_modal", {delay: 0.2, xPercent: -100})
                      .to(".menu_inner_modal", {opacity: 1});

 

[GreenSock]

I'm a little fuzzy on what exactly you're asking here - can you please provide a minimal demo (like a CodePen)? That will significantly increase your chances of getting an accurate answer