/* AtCare Product Filter — scoped styles, independent of BeTheme buttons */
.atcare-filter {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 28px;
  position: relative;
}
.atcare-filter *, .atcare-filter *::before, .atcare-filter *::after { box-sizing: border-box; }
.atcare-filter__pills {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: var(--atcare-pill-gap, 10px);
  width: 100%;
}
.atcare-filter .atcare-filter__pill,
.atcare-filter button.atcare-filter__pill {
  -webkit-appearance: none;
  appearance: none;
  min-height: 38px;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  position: relative;
  gap: 8px;
  padding: var(--atcare-pill-py, 12px) var(--atcare-pill-px, 20px);
  border: 1px solid var(--atcare-base-border, #e0e8df);
  border-radius: var(--atcare-pill-radius, 999px);
  background: var(--atcare-base-bg, #fff);
  background-image: none;
  color: var(--atcare-base-text, #27332b);
  text-decoration: none;
  text-shadow: none;
  box-shadow: var(--atcare-pill-shadow, none);
  outline: none;
  font-family: var(--atcare-pill-font, inherit);
  font-size: var(--atcare-font-size, 14px);
  font-weight: var(--atcare-font-weight, 600);
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.atcare-filter .atcare-filter__pill::before,
.atcare-filter .atcare-filter__pill::after { content: none !important; }
.atcare-filter .atcare-filter__pill:hover {
  background: var(--atcare-hover-bg, #edf6ed);
  border-color: var(--atcare-hover-border, #bbd4bc);
  color: var(--atcare-hover-text, #1d4e36);
  transform: translateY(-1px);
}
.atcare-filter .atcare-filter__pill.is-active,
.atcare-filter .atcare-filter__pill.is-active:hover {
  background: var(--atcare-active-bg, #24553d);
  border-color: var(--atcare-active-border, #24553d);
  color: var(--atcare-active-text, #fff);
  transform: none;
}
.atcare-filter .atcare-filter__pill:focus-visible {
  outline: 2px solid var(--atcare-active-bg, #24553d);
  outline-offset: 3px;
}
.atcare-filter .atcare-filter__pill .atcare-filter__count {
  color: var(--atcare-count-color, #667a6b);
  font-size: .78em;
  font-weight: 700;
  line-height: 1;
  opacity: .95;
}
.atcare-filter .atcare-filter__pill.is-active .atcare-filter__count {
  color: inherit;
  opacity: .7;
}
/* Extra specificity is intentional: BeTheme often sets layout-specific display rules. */
.atcare-filter-grid .atcare-product-card[hidden],
.atcare-filter-grid .mfn-queryloop-item-wrapper[hidden],
.atcare-filter-grid [data-atcare-hidden="true"] { display: none !important; }
.atcare-filter .atcare-filter__debug[hidden] { display: none !important; }
.atcare-filter__debug, .atcare-filter-setup {
  font-size: 13px;
  color: #815225;
  background: #fff9e8;
  border: 1px solid #f3deb2;
  padding: 11px 14px;
  border-radius: 12px;
}
.atcare-filter .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@media (max-width: 767px) {
  .atcare-filter { margin-bottom: 22px; }
  .atcare-filter--scroll .atcare-filter__pills {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 3px 1px 9px;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }
  .atcare-filter--scroll .atcare-filter__pills::-webkit-scrollbar { display: none; }
  .atcare-filter--scroll .atcare-filter__pill { scroll-snap-align: start; }
  .atcare-filter--wrap .atcare-filter__pills { flex-wrap: wrap; }
  .atcare-filter .atcare-filter__pill,
  .atcare-filter button.atcare-filter__pill {
    min-height: 42px;
    font-size: clamp(12px, var(--atcare-font-size, 14px), 16px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .atcare-filter .atcare-filter__pill { transition: none; }
  .atcare-filter .atcare-filter__pill:hover { transform: none; }
}

.atcare-filter__editor-note { font-size: 12px; padding: 9px 12px; background: #f7faf7; border: 1px solid #dfe6df; color: #385342; border-radius: 9px; margin-top: 12px; }

/* Visibility for matched BeBuilder wraps and responsive empty state. */
.atcare-filter-grid [data-atcare-hidden="true"] { display: none !important; }
.atcare-filter .atcare-filter__empty[hidden] { display: none !important; }
.atcare-filter__empty { padding: 18px; border-radius: 12px; background: #f7faf7; color: #52665b; font-size: 14px; }
