/* Sticky header style - making the background slightly blurred and reducing the opacity /
/ Additionally, the reason for setting the position as absolute is to avoid the content of the page appearing shifted downwards with empty space when the bottom section is not visible. I made the bottom section inactive. */
.whb-header-bottom {
background-color: rgba(255, 255, 255, 0.82)!important;
backdrop-filter: blur(16px);
position: absolute;
width: -webkit-fill-available;
}
/* The sticky header will not be initially visible and will only appear when scrolled */
.whb-header-bottom {
opacity: 0;
pointer-events: none;
}
.whb-sticked > .whb-main-header > .whb-header-bottom {
opacity: 1;
pointer-events: all;
}Thank you for your help, my friend. However, I managed to solve it myself. I wanted to share this code with you. Translate the parts in Turkish to English if needed.
