problem with fixed header

Hi there,

I’m currently using your free shipping bar plugin and I’m experiencing an issue with how it interacts with my website header.

My header is set as a sticky/fixed header (using Elementor/Astra), and the free shipping bar is also fixed at the top of the page. Because of this, both elements overlap each other when scrolling.

At first load, everything looks fine, but once I start scrolling, the header becomes sticky and moves to the top, causing it to overlap with the free shipping bar. This creates a visual conflict where either the bar or the header is partially hidden.

I have tried using the “Header selector” option and adjusting it with different selectors (such as `.elementor-location-header` and custom IDs), as well as applying custom CSS to offset the header position, but the issue persists.

Is there a recommended way to properly offset the sticky header or make the free shipping bar adapt dynamically when the header becomes sticky?

Alternatively, is there an option to make the bar behave differently (for example, not fixed, or automatically positioned below the header when scrolling)?

Thanks in advance for your help.