how to hide submenus for the not active pages

I would like to expand only the active part of the sidebar menu and hide the parts which have nothing to do with the actual selection. Just like how its done on every Explorer like file manager, or how it is with accordion menus.

In the default TwentyTen theme, this is the class definition for the active submenu:

menu-item menu-item-type-post_type menu-item-object-page current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor

and this is the one for a non-active submenu:

menu-item menu-item-type-post_type menu-item-object-page

So I’m thinking about using something like:

li .menu-item ul .sub-menu { display: none; }
li .current-menu-parent ul .sub-menu { display: inherit; }

Would something like this work? It must be a fairly common problem, but I have not found a single solution with Google.

To have an idea why it’s important to make the menu smaller, here is the site I’m working on where the menu is overly complicated:
https://kek.org.hu/kozossegikertek