/**
 * Layered Navigation Styles
 * Absolute positioning to keep navigation visible while scrolling
 */

/* Make sidebar.main (layered navigation container) sticky/absolute */
.sidebar-main {
    position: sticky;
    top: 20px;
    align-self: flex-start;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    z-index: 10;
}

/* Ensure the layered navigation block stays visible */
.block.filter {
    position: relative;
}

/* Adjust main content area to account for sidebar */
.columns .column.main {
    position: relative;
}

/* Products container - scroll target */
#category-products-container {
    scroll-margin-top: 20px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .sidebar-main {
        position: relative;
        top: 0;
        max-height: none;
        overflow-y: visible;
    }
}