Produktfilter: filtert die Produktkacheln über alle Seiten

Sortiment und Kategorieseiten zeigen den Filter als Leiste über den Kacheln, am Handy zugeklappt; Seitenzahlen und Trefferzahl beziehen sich auf das gefilterte Ergebnis.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

1 files changed, 13 insertions, 0 deletions

diff --git a/views/css/wpsg-theme.css b/views/css/wpsg-theme.css
index e5d6727..4515211 100644
--- a/views/css/wpsg-theme.css
+++ b/views/css/wpsg-theme.css
@@ -649,6 +649,19 @@ html body .wpsg_product_garan_wrap a.wpsg_product_garan img { display:block; max
 /* Blöcke: Produktliste, Mini-Warenkorb, Kundenkonto */
 .wpsg-block-product-list :where(.wpsg-product-list__count) { margin:0 0 var(--wpsg-gap); }
 .wpsg-block-product-list :where(.wpsg-product-list__count:empty) { display:none; }
+/* Produktkacheln (Abfrage-Schleife, Kategorievorlage): Statuszeile des Filters und Filter als Leiste über den Kacheln */
+.wpsg-product-tiles :where(.wpsg-product-list__count) { margin:0 0 var(--wpsg-gap); }
+.wpsg-product-tiles :where(.wpsg-product-list__count:empty) { display:none; }
+.wpsg-product-tiles :where(.wpsg-block-product-filter) { margin:0 0 calc(var(--wpsg-gap) * 2) 0; }
+.wpsg-product-tiles :where(.wpsg-pvf__fields) { display:flex; flex-wrap:wrap; align-items:flex-start; gap:var(--wpsg-gap) calc(var(--wpsg-gap) * 2); margin-top:var(--wpsg-gap); }
+.wpsg-product-tiles :where(.wpsg-pvf__fields > .wpsg-pvf__item) { margin:0; }
+.wpsg-product-tiles :where(.wpsg-pvf__fields > .wpsg-pvf__actions) { align-self:flex-end; }
+.wpsg-pvf__summary { display:inline-flex; list-style:none; cursor:pointer; }
+.wpsg-pvf__summary::-webkit-details-marker { display:none; }
+@media (min-width:782px) {
+	.wpsg-pvf__toggle > .wpsg-pvf__summary { display:none; }
+	.wpsg-product-tiles :where(.wpsg-pvf__fields) { margin-top:0; }
+}
 .wpsg-block-product-list :where(.wpsg-product-list__items) { display:grid; grid-template-columns:repeat(var(--wpsg-columns, 3), minmax(0, 1fr)); gap:calc(var(--wpsg-gap) * 2) var(--wpsg-gap); list-style:none; margin:0; padding:0; }
 .wpsg-block-product-list :where(.wpsg-product-list__item) { display:flex; flex-direction:column; gap:0.5em; min-width:0; margin:0; padding:0; }
 .wpsg-block-product-list :where(.wpsg-product-list__image img) { display:block; width:100%; height:auto; }