Mobile Menu issue

Hei

i created a similar post on the forum corresponding to my theme.. but i received no answer. Hope someone can help me here (if it’s the right place)

I have a responsive theme. In mobile view, the menu is not displaying my list as i would like to. I explain:
If an item in my list has children, then the menu (when opened) just displays all items with children visible.
I would like the items to be “closed” and then open/close to see/hide the children by clicking on the item.

I managed to hide the children of an item by modifying the CSS:
.mobile-menu > li > ul {display: none;}

Then, using :
.mobile-menu> li:hover > ul {
display: block;
}
I see the children when my mouse is over the item… but this is not what I want and really not user-friendly.

Is it a way to fix this in CSS? to toggle the visibility of the children of an item?

Thanks for help