issue when having a pop-up on top of another one

Our application would need to have a pop-up on top of another one.
This feature works ok but the fact that we have a second pop-up does not disable the first one. I still can enter some info in it, move it etc.

To keep things simple, I have built an example based on the booking-faces application.

I have the following xml code:

<view-state id="changeSearchCriteria" view="enterSearchCriteria.xhtml" popup="true">
<on-entry>
<render fragments="hotelSearchFragment" />
</on-entry>
<transition on="search" to="reviewHotels">
<evaluate expression="searchCriteria.resetPage()"/>
</transition>
<transition on="popTransition" to="popState"/>
</view-state>

<view-state id="popState" view="enterSearchCriteria.xhtml" popup="true">
<on-entry>
<render fragments="hotelSearchFragment" />
</on-entry>
<transition on="search" to="reviewHotels">
<evaluate expression="searchCriteria.resetPage()"/>
</transition>
</view-state>

As you can see on the attached screenshot, the first pop-up has not been disabled.