/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 30 2025 | 12:27:27 */
/* Add your CSS code here.

For example:
.example {
    color: red;
}

For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp

End of comment */ 

/* Transform WooCommerce layered nav into button grid */
.woocommerce-widget-layered-nav-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-widget-layered-nav-list__item {
    margin: 0;
}

.woocommerce-widget-layered-nav-list__item a {
    display: block;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-decoration: none;
    text-align: center;
    font-size: 14px;
    color: #333;
    background-color: #fff;
    transition: all 0.2s ease;
}

.woocommerce-widget-layered-nav-list__item a:hover {
    border-color: #999;
    background-color: #f5f5f5;
}

.woocommerce-widget-layered-nav-list__item a:focus {
    outline: 2px solid #0073aa;
    outline-offset: 2px;
}

/* Hide the count spans */
.woocommerce-widget-layered-nav-list__item .count {
    display: none;
}

/* Optional: Style for active/selected filters */
.woocommerce-widget-layered-nav-list__item.chosen a,
.woocommerce-widget-layered-nav-list__item.wc-layered-nav-term-selected a {
    background-color: #0073aa;
    color: white;
    border-color: #0073aa;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .woocommerce-widget-layered-nav-list {
        grid-template-columns: repeat(auto-fill, minmax(50px, 1fr));
        gap: 6px;
    }
    
    .woocommerce-widget-layered-nav-list__item a {
        padding: 6px 8px;
        font-size: 13px;
    }
}

.k-sidenav .widget {
    margin-bottom: 5px;
}