Little bug of Bubble Autocomplete + Ultimo 1.19.1

[LuizSantos22]

How to reproduce the bug

Install the latest version of OpenMage v20.1.1
Install the latest vertion of Ultimo v.1.19.1
Any php version that is compatible with the above ones i

The dropdown bar will be shown behind the main menu, this issue is present in Ultimo, if you switch
it to "rwd" theme, it will not show this issue.

Here is a video showing the issue:
https://www.loom.com/share/95e985cd109a4feeac831ea5a62e156e?sid=8bc1e13b-9293-48eb-9562-3a547515e046

I have tried to override using the "autocomplete.css" and neither "base" or "rwd" worked

[LuizSantos22]

Hi there,
In a lack of 1 solution, I've found 2 :D

Solution 1 - By "Ultimo - Custom.css"

1.1 - Go to: skin/frontend/ultimo/default/css/
Edit the file called "SAMPLE.custom.css" and create another one called "custom.css"
1.2 - Copy the content fromm "SAMPLE.custom.css" to the "custom.css" and
add make this declaration at the end

div.tt-menu { z-index: 10000 !important; }

Save and clear cache of the website and the browser history.
It should work!

Solution 2 - By using "autocomplete.css"

2.1 You might copy it (I prefer reapload it already modifiled)
from the "rwd" to "ultimo", so the copy from this skin/frontend/rwd/default/css/bubble/autocomplete.css
will also become this skin/frontend/ultimo/default/css/bubble/autocomplete.css

Edit "autocomplete.css" from the "Ultimo path" (it is important that you've copied it from "rwd" folder)
and insert the follwing declaration below

.tt-menu { z-index: 10000 !important; }

Just UNDER this declaration:

.tt-dropdown-menu { margin-top: 15px; width: 30000px !important; /* Adjust the width as needed */ }

Save it and clear cache from the website and the broswer history as well

I have recorded a video tutorial:

https://www.loom.com/share/322f045e6b8f4edda36fadb28f4f3d66?sid=4d873a15-6cdf-4a9c-8310-52cbc361d077