Multiple Dropdown Menus are conflicting with my menu-toggle animation

In the project below, I have 3 dropdown-menus in a side-nav. Each menu has 3 links that appear when opened. I created an animation that rotates a little toggle icon and changes the opacity of the link list to form a smooth transition. It works great when I just open and close each dropdown menu. But if I have one menu open and then I try opening another menu without closing the first, things break. Id like the user to be able to have multiple menus opened at once. The problem seems to be that the list of the first opened menu gets hidden when the second menu is opened (clicked). Clicking on the second menu should not do anything to the elements of the first menu. I have the animation’s Affect/Class setting on ‘Only Children With This Class’. And Ive tried duplicating classes but I still cant get it to work. Any ideas? Thanks!

Here is my public share link: https://preview.webflow.com/preview/sandbox-ee8c59?utm_medium=preview_link&utm_source=designer&utm_content=sandbox-ee8c59&preview=4ac02b55e3df9c82eaa94a521d387182&mode=preview
(how to access public share link)

Here’s the link to the published page… Im not sure why but the animations do not seem to be working in the Webflow Designer Read-Only Share Link. But it works on the published page and in my designer.