/* Filter Button */
.filter-btn {
  transition: color 0.6s cubic-bezier(0.625, 0.05, 0, 1), background-color 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}

.filter-btn[data-filter-status="active"] {
  background-color: transparent;
  color: #ff5349;
}

.filter-btn .filter-icon {
  opacity: 0;
  transition: opacity 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}

.filter-btn[data-filter-status="active"] .filter-icon {
  opacity: 1;
}

.filter-btn.solution-filter-btn[data-filter-status="active"] {
  background-color: transparent;
  color: #ff5349;
}

.filter-btn.solution-filter-btn .filter-icon {
  opacity: 0;
  transition: opacity 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}

.filter-btn.solution-filter-btn[data-filter-status="active"] .filter-icon {
  opacity: 1;
}

/* Reset Button */
.reset-btn {
  transition: all 0.6s cubic-bezier(0.625, 0.05, 0, 1);

}

.reset-btn[data-filter-status="active"] {}

/* Filter List Item */
.filter-list__item[data-filter-status="active"] {
  transition: opacity 0.6s cubic-bezier(0.625, 0.05, 0, 1), transform 0.6s cubic-bezier(0.625, 0.05, 0, 1);
  transform: scale(1) rotate(0.001deg);
  opacity: 1;
  visibility: visible;
  position: relative;
}

.filter-list__item[data-filter-status="transition-out"] {
  transition: opacity 0.45s cubic-bezier(0.625, 0.05, 0, 1), transform 0.45s cubic-bezier(0.625, 0.05, 0, 1);
  transform: scale(0.9) rotate(0.001deg);
  opacity: 0;
  visibility: visible;
}

.filter-list__item[data-filter-status="not-active"] {
  transform: scale(0.9) rotate(0.001deg);
  opacity: 0;
  visibility: hidden;
  position: absolute;
}

/* Collapsible filter section */
[data-collapse-section] {
  position: relative;
}

/*
 * Reset the button styling if .filter_heading_wrap
 * is changed from a div to a button.
 */
button.filter_heading_wrap {
  width: 100%;
  appearance: none;
  cursor: pointer;
}

/*
 * The wrapper animates between zero and one
 * fractional grid row.
 */
.sub_filters_wrap {
  position: relative;
  display: grid;
  grid-template-rows: 0fr;
  transition:
    grid-template-rows 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}

/*
 * This is essential. Without min-height: 0,
 * the grid row may refuse to fully collapse.
 */
.sub_filters_inner {
  min-height: 0;
}

/*
 * The overlay must not create a second grid row.
 */
.sub_filters_overlay {
  pointer-events: none;
}

/* Open state */
[data-collapse-section][data-collapse-open]>.sub_filters_wrap {
  grid-template-rows: 1fr;
}

/* Arrow animation */
.filter-section-icon {
  transition:
    transform 0.6s cubic-bezier(0.625, 0.05, 0, 1);
  transform: rotate(180deg);
  transform-origin: center;
}

/* Adjust the rotation direction if necessary */
[data-collapse-section][data-collapse-open] .filter-section-icon {
  transform: rotate(0deg);
}

/*
 * While searching, automatically expand every
 * section containing at least one matching result.
 */
[data-live-search-active] [data-live-search-section-match]>.sub_filters_wrap {
  grid-template-rows: 1fr;
}

/* Scrollable filter section */
.sub_filters_inner {
  /* Your existing settings */
  overflow-y: auto;

  /* Prevent layout shifting when scrollbar appears */
  scrollbar-gutter: stable;

  /* Firefox */
  scrollbar-width: thin;
  scrollbar-color: #8e98a1 transparent;
}

/* Chrome, Edge and Safari */
.sub_filters_inner::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.sub_filters_inner::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 999px;
}

.sub_filters_inner::-webkit-scrollbar-thumb {
  background: #8e98a1;
  border-radius: 999px;
}

.sub_filters_inner::-webkit-scrollbar-thumb:hover {
  background: #1b252e;
}

.sub_filters_wrap.is-flat {
  grid-template-rows: 1fr;
}

:root {
  --filter-ease:
    cubic-bezier(0.625, 0.05, 0, 1);
}

/* Each button and dropdown pair */
.filter_menu {
  position: relative;
  z-index: 1;
}

/* Keep the open dropdown above nearby content */
.filter_menu[data-filter-menu-open] {
  z-index: 100;
}

/* Main dropdown closed state */
.filter_menu_wrap {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform:
    translate3d(0, -0.5rem, 0) scale(0.985);

  transform-origin: top center;

  transition:
    opacity 0.6s var(--filter-ease),
    transform 0.6s var(--filter-ease),
    visibility 0s linear 0.6s;

  will-change: opacity, transform;
}

/* Main dropdown open state */
.filter_menu[data-filter-menu-open]>.filter_menu_wrap {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transform:
    translate3d(0, 0, 0) scale(1);

  transition:
    opacity 0.6s var(--filter-ease),
    transform 0.6s var(--filter-ease),
    visibility 0s linear 0s;
}

/* Arrow beside All Solutions / All Industries */
.filter-button-icon {
  transform: rotate(0deg);
  transform-origin: center;

  transition:
    transform 0.6s var(--filter-ease);
}

.filter_menu[data-filter-menu-open] .filter-button-icon {
  transform: rotate(180deg);
}
