/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./frontend/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./frontend/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./frontend/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./web/app/themes/parent/components/blog-filters/src/blog-filters.scss ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&display=swap);
/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./frontend/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./frontend/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./frontend/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./web/app/themes/parent/components/blog-filters/src/blog-filters.scss (1) ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************/
.twz-blog-filters {
  margin-bottom: 8rem;
}
@media (max-width: 767px) {
  .twz-blog-filters {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
.twz-blog-filters__wrapper {
  display: flex;
  color: var(--grey-300);
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  gap: 3rem;
  font-weight: 600;
  font-size: 2.2rem;
  white-space: nowrap;
}
.twz-blog-filters__wrapper::after {
  content: "";
  height: 0.2rem;
  width: 100vw;
  position: absolute;
  background: var(--cyan-500);
  bottom: 0;
  opacity: 0.4;
}
.twz-blog-filters__wrapper .twz-blog-filter {
  position: relative;
  height: 4rem;
  width: 12rem;
  flex-shrink: 0;
}
.twz-blog-filters__wrapper .twz-blog-filter a {
  font-weight: 600;
  font-size: 2.2rem;
  color: var(--grey-300);
  text-decoration: none;
  padding-left: 2rem;
}
.twz-blog-filters__wrapper .twz-blog-filter label {
  position: relative;
  display: block;
  height: 100%;
  width: 100%;
  padding-left: 2rem;
  cursor: pointer;
}
.twz-blog-filters__wrapper .twz-blog-filter input[type=radio] {
  position: absolute;
  z-index: -9999;
  left: -6249.9375rem;
  top: 0;
  opacity: 0;
}
.twz-blog-filters__wrapper .twz-blog-filter:has(input:checked) label,
.twz-blog-filters__wrapper .twz-blog-filter:has(input:checked) a, .twz-blog-filters__wrapper .twz-blog-filter:has(a.checked) label,
.twz-blog-filters__wrapper .twz-blog-filter:has(a.checked) a {
  color: var(--cyan-600);
}
.twz-blog-filters__wrapper .twz-blog-filter:has(input:checked) label::after,
.twz-blog-filters__wrapper .twz-blog-filter:has(input:checked) a::after, .twz-blog-filters__wrapper .twz-blog-filter:has(a.checked) label::after,
.twz-blog-filters__wrapper .twz-blog-filter:has(a.checked) a::after {
  content: "";
  background: var(--cyan-600);
  width: 100%;
  height: 6rem;
  position: absolute;
  bottom: -0.1rem;
  left: 0;
  z-index: 2;
  clip-path: polygon(5% 90%, 100% 90%, 95% 100%, 0 100%);
}