/* ==========================================================
   GR21 SEO Filter Landingpages + Category Filter Chips
   ========================================================== */
.gr21-seo-filter-box,
.gr21-seo-filter-page * { box-sizing: border-box; }

.gr21-seo-filter-box {
  margin: 1.1rem 0 1.25rem;
  padding: 1rem;
  border: 1px solid #dce9df;
  border-radius: 20px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbf8 100%);
  box-shadow: 0 8px 22px rgba(0,0,0,.035);
}
.gr21-seo-filter-head { margin-bottom: .8rem; }
.gr21-seo-filter-head strong {
  display: block;
  color: #073b17;
  font-size: 1.08rem;
  font-weight: 900;
}
.gr21-seo-filter-head span {
  display: block;
  font-size: .92rem;
}
.gr21-seo-filter-groups { display: flex; flex-wrap: wrap; gap: .9rem; }
.gr21-seo-filter-group { flex: 1 1 280px; min-width: 240px; }
.gr21-seo-filter-group-title {
  margin-bottom: .35rem;
  color: #123b20;
  font-weight: 850;
  font-size: .95rem;
}
.gr21-seo-filter-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.gr21-seo-filter-chip {
  display: inline-flex;
  align-items: center;
  padding: .5rem .75rem;
  border: 1px solid #cfe0d4;
  border-radius: 999px;
  background: #fff;
  color: #073b17 !important;
  font-weight: 750;
  font-size: .9rem;
  text-decoration: none !important;
}
.gr21-seo-filter-chip:hover {
  border-color: #036811;
  background: #e9f7ed;
  color: #036811 !important;
}
.gr21-filter-hero {
  margin: 1rem 0 1.1rem;
  padding: clamp(1rem, 2vw, 1.5rem);
  border-radius: 24px;
  background: radial-gradient(circle at top right, rgba(3,104,17,.08), transparent 38%), linear-gradient(180deg, #fff 0%, #f7fbf8 100%);
  box-shadow: 0 10px 28px rgba(0,0,0,.045);
}
.gr21-filter-back { margin-bottom: .55rem; }
.gr21-filter-back a { color: #036811 !important; font-weight: 800; text-decoration: none !important; }
.gr21-filter-hero h1 { color: #053817; font-size: clamp(1.45rem, 2.2vw, 2.2rem); font-weight: 900; line-height: 1.15; margin: 0 0 .7rem; }
.gr21-filter-intro { color: #314238; line-height: 1.65; }
.gr21-filter-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem;
  margin: 0 0 1rem;
  padding: .8rem;
  border: 1px solid #e2ebe5;
  border-radius: 18px;
  background: #fff;
}
.gr21-filter-toolbar > span { margin-right: .3rem; font-weight: 800; }
.gr21-filter-sort {
  display: inline-flex;
  padding: .42rem .7rem;
  border-radius: 999px;
  border: 1px solid #d8e6dc;
  background: #fbfdfb;
  color: #213228 !important;
  font-weight: 750;
  font-size: .88rem;
  text-decoration: none !important;
}
.gr21-filter-sort.is-active,
.gr21-filter-sort:hover { background: #e9f7ed; border-color: #036811; color: #036811 !important; }
.gr21-filter-product-grid { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1rem 0; }
.gr21-filter-product-card {
  flex: 1 1 230px;
  max-width: calc(25% - .75rem);
  min-width: 220px;
  border: 1px solid #dfeae2;
  border-radius: 20px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 7px 20px rgba(0,0,0,.035);
}
.gr21-filter-product-image { display: block; aspect-ratio: 1/1; background: #eef6f0; overflow: hidden; }
.gr21-filter-product-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.gr21-filter-product-image span { display: flex; height: 100%; align-items: center; justify-content: center; font-weight: 800; }
.gr21-filter-product-body { padding: .85rem; }
.gr21-filter-product-body h2 { margin: 0 0 .45rem; font-size: 1rem; line-height: 1.25; }
.gr21-filter-product-body h2 a { color: #073b17 !important; font-weight: 900; text-decoration: none !important; }
.gr21-filter-product-price { display: inline-flex; padding: .2rem .58rem; border-radius: 999px; background: #e9f7ed; color: #036811; font-weight: 950; }
.gr21-filter-product-rating { margin-top: .4rem; font-size: .85rem; }
.gr21-filter-empty { padding: 1rem; border-radius: 16px; background: #fff7e8; color: #6a4200; font-weight: 700; }
@media (max-width: 1199px) { .gr21-filter-product-card { max-width: calc(50% - .5rem); } }
@media (max-width: 575.98px) { .gr21-seo-filter-groups { display: block; } .gr21-seo-filter-group + .gr21-seo-filter-group { margin-top: .8rem; } .gr21-filter-product-card { flex-basis: 100%; max-width: 100%; } }

/* GR21 SEO Filter V2 additions */
.gr21-filter-subheadline {
  margin: -.25rem 0 1rem !important;
  color: #52645a !important;
  font-weight: 700 !important;
  font-size: 1.05rem !important;
}
.gr21-filter-content-block {
  margin: 1rem 0 !important;
  padding: 1rem 1.1rem !important;
  border-radius: 18px !important;
  border: 1px solid #e2ebe5 !important;
  background: #fff !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.028) !important;
  color: #314238 !important;
}
.gr21-filter-content-block h2 {
  margin-top: 0 !important;
  color: #053817 !important;
  font-weight: 850 !important;
}
.gr21-filter-benefits {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .85rem !important;
  margin: 1rem 0 !important;
}
.gr21-filter-benefit-card {
  flex: 1 1 260px !important;
  display: flex !important;
  gap: .75rem !important;
  align-items: flex-start !important;
  padding: .9rem !important;
  border: 1px solid #dfeae2 !important;
  border-radius: 16px !important;
  background: #fbfdfb !important;
  box-shadow: 0 5px 16px rgba(0,0,0,.025) !important;
}
.gr21-filter-benefit-icon {
  flex: 0 0 38px !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 13px !important;
  background: #e9f7ed !important;
  color: #036811 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 900 !important;
}
.gr21-filter-benefit-card strong {
  display: block !important;
  margin-bottom: .25rem !important;
  color: #123b20 !important;
}
.gr21-filter-internal-links {
  margin: 1rem 0 !important;
  padding: 1rem !important;
  border-radius: 18px !important;
  border: 1px solid #e2ebe5 !important;
}
.gr21-filter-link-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .85rem !important;
}
.gr21-filter-link-card {
  flex: 1 1 220px !important;
  display: block !important;
  padding: .9rem !important;
  border-radius: 15px !important;
  border: 1px solid #c8dece !important;
  background: #fff !important;
  text-decoration: none !important;
  color: #073b17 !important;
}
.gr21-filter-link-card:hover {
  border-color: #036811 !important;
  box-shadow: 0 10px 22px rgba(3,104,17,.10) !important;
  text-decoration: none !important;
}
.gr21-filter-link-card strong,
.gr21-filter-link-card span {
  display: block !important;
}
.gr21-filter-link-card span {
  margin-top: .25rem !important;
  color: #4b5d52 !important;
  font-weight: 600 !important;
  font-size: .9rem !important;
}

/* ==========================================================
   GR21 V2.7 - native listing integration
   - Filter-Landingpages nutzen wieder das normale Zen-Cart Listing
   - Sortier-Chips können auch auf Kategorie-Seiten angezeigt werden
   ========================================================== */
.gr21-listing-sort-toolbar {
  margin: 1rem 0 1.15rem;
}

.gr21-seo-filter-page-native-listing #productsListing {
  margin-top: 0;
}

.gr21-seo-filter-page-native-listing #productsListing-topRow {
  margin: .7rem 0 1rem;
}

.gr21-seo-filter-page-native-listing .centerBoxContentsListing,
.gr21-seo-filter-page-native-listing .card.centerBoxContentsListing {
  /* Kein eigenes Filterseiten-Carddesign mehr: die normale Shop-Optik bleibt maßgeblich. */
}