/* Shared filter styles for DEV template 7888. Preserve the original selector specificity. */
#brx-content :where(.kosm-cat-filters) .wpgb-checkbox-label {
  font-size: var(--text-s);
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  color: var(--base-dark);
  transition: color 0.2s ease;
}
#brx-content :where(.kosm-cat-filters) .wpgb-checkbox:hover .wpgb-checkbox-label {
  color: var(--base-ultra-dark);
}
#brx-content :where(.kosm-cat-filters) .wpgb-checkbox-label span {
  font-size: var(--text-xs);
  background-color: var(--base-ultra-light);
  color: var(--base-medium);
  padding: calc(var(--space-s) / 4) var(--space-xs);
  border-radius: var(--radius-full);
  margin-left: var(--space-s);
  line-height: 1.2;
}
#brx-content :where(.kosm-cat-filters) .wpgb-checkbox-control {
  border-radius: var(--radius-s);
  border: 1.5px solid var(--base-light);
  transition: all 0.2s ease;
  margin-top: 1px;
}
#brx-content :where(.kosm-cat-filters) .wpgb-checkbox:hover .wpgb-checkbox-control {
  border-color: var(--primary);
}
#brx-content :where(.kosm-cat-filters) .wpgb-checkbox[aria-pressed="true"] .wpgb-checkbox-control {
  background-color: var(--primary);
  border-color: var(--primary);
}
#brx-content :where(.kosm-cat-filters) .wpgb-hierarchical-list li {
  margin-bottom: var(--space-xs);
}
#brx-content :where(.kosm-cat-filters) .wpgb-facet, #brx-content :where(.kosm-cat-filters) .wpgb-facet fieldset, #brx-content :where(.kosm-cat-filters) .wpgb-checkbox-facet {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
#brx-content :where(.kosm-cat-filters) .wpgb-hierarchical-list li:last-child {
  margin-bottom: 0 !important;
}
/* The mobile panel keeps its existing touch spacing. */
#brx-content :where(.kosm-cat-filters--mobile) .wpgb-checkbox-label {
  padding-top: var(--space-3xs);
  padding-bottom: var(--space-3xs);
  cursor: pointer;
}
/* Hide empty facet groups after WP Grid Builder refreshes them. */
#brx-content :where(.kosm-cat-filter-item):has(.wpgb-facet[hidden]) {
  display: none !important;
}
/* Loop elements use classes; keep these rules independent of CLI CSS generation. */
.kosm-cat-pellet-badge {
  transform: translateX(-50%);
  pointer-events: none;
}
.kosm-cat-product-title a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}