
.products { list-style: none; margin: 0; padding: 0 !important; clear: both;}
.prod { width: 29%; margin: 2%; float: left; padding:0; }
.prod:nth-of-type(3n+1) { clear: both; margin-left: 0; }
.prod img { display: block; }
.price { text-align: center; }
.sort-by-select { float: left; }
.shop-name { font-size: 10px; text-align: center; display:none; }
.pagination { clear:both; margin-top: 50px; text-align: center; }
.pagination a { display: inline-block; background: #eee; border-radius: 5px; padding: 5px 10px; margin-right: 5px; margin-bottom: 5px; }
.floatleft { float: left }
.floatright { float: right }
.page-nr { margin-left: 10px; }
.clearout { clear:both; }
.btn-filter-active { background: #333; color: #fff; display: inline-block; padding: 3px 10px; border-radius: 20px; margin-right: 3px; margin-bottom: 5px; }
a.btn-filter-active { color: #fff; text-decoration: none; }
a.btn-filter-active:hover { color: #fff; background: #777; }
.attr-filter { margin-bottom: 20px; }
.attr-filter a.active { background-color: #ccc; padding: 3px; border-radius: 3px; }
.alert.alert-info { background-color: lightblue; border: 1px solid blue; border-radius: 3px; display: inline-block; padding: 3px 5px; margin-bottom: 20px; }
.search-wrapper {
            position: relative;
        }
        .search-wrapper .search-field {
            display: none; /* Hidden by default */
            padding: 5px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }
        .search-wrapper .search-icon {
            font-size: 24px;
            cursor: pointer;
            display: inline-block;
            padding: 5px;
        }
        .search-wrapper .search-wrapper.expanded .search-field {
            display: inline-block; /* Show the search field when expanded */
        }

.shops-list { list-style: none; margin: 0; padding: 0 !important; display: flex; flex-wrap: wrap; gap: 15px; }
.shop-card { width: 30%; min-width: 200px; }
.shop-card a { display: block; padding: 20px; background: #f7f7f7; border-radius: 8px; text-decoration: none; color: #333; text-align: center; transition: background 0.2s; }
.shop-card a:hover { background: #eee; }
.shop-card strong { display: block; font-size: 16px; margin-bottom: 5px; }
.shop-card .shop-count { display: block; font-size: 13px; color: #666; }

@media screen and (max-width: 992px) {
    .prod { width: 48%; margin: 0%;} 
    .prod:nth-of-type(3n+1) { clear: none; }
    .prod:nth-of-type(2n+1) { clear: both; margin-right: 3% }
    .shop-card { width: 46%; min-width: unset; }
}