/*your custom css goes here*/ 
.custom-logo {
    max-height: 55px;
    width: auto;
}

@media (max-width: 576px) { 
    .custom-logo {
        max-height: 40px; 
    }
}

.hover-category-menu {
    position: absolute;       /* already in your HTML */
    top: 100%;                /* ensure correct position */
    left: 0;
    right: 0;
    max-height: 80vh;         /* limit overlay height */
    overflow: hidden;         /* prevent it from scrolling itself */
    z-index: 9999;
}

/* Make the actual category list area scrollable */
.hover-category-menu .position-static {
    max-height: 80vh;              /* very important: restrict height */
    overflow-y: auto;              /* allow vertical scroll */
    -webkit-overflow-scrolling: touch; /* mobile smooth scroll */
}

/* Optional: better looking scrollbar */
.hover-category-menu .position-static::-webkit-scrollbar {
    width: 6px;
}
.hover-category-menu .position-static::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 3px;
}