.dropdown {
  width: 100%;
  max-width: 60rem;
  min-width: 21.5rem;
  position: relative
}
.dropdown__button {
  width: 100%;
  text-align: start;
  padding: var(--sm-3);
  font-size: var(--body-s-font-size);
  line-height: var(--body-s-line-height);
  font-weight: var(--body-s-weight);
  letter-spacing: var(--body-s-letter-spacing);
  background: var(--base-5);
  border: none;
  box-shadow: inset 0 0 0 1px var(--base-3);
  color: var(--base-1);
  transition: all .25s;
  display: flex;
  align-items: center;
  gap: var(--xs-1);
  border-radius: var(--input-radius)
}
.dropdown__button .icon {
  font-size: 2.4rem;
  color: var(--base-1)
}
.dropdown__button .icon:last-of-type {
  transition: all .5s
}
.dropdown__button:hover {
  outline-color: var(--base-1)
}
.dropdown__button:hover span {
  color: var(--base-1)
}
.dropdown__button:focus-within {
  box-shadow: inset 0 0 0 2px var(--base-2)
}
.dropdown__button:disabled {
  color: var(--base-2);
  box-shadow: inset 0 0 0 1px var(--base-3);
  background-color: var(--base-4)
}
.dropdown__button:disabled:hover {
  color: var(--base-2)
}
.dropdown__button:disabled:hover span {
  color: var(--base-2)
}
.dropdown__button.show {
  outline-color: var(--base-1);
  background-color: var(--base-1);
  color: var(--base-5);
  box-shadow: inset 0 0 0 1px var(--base-1)
}
.dropdown__button.show span {
  color: var(--base-5)
}
.dropdown__button.show .icon {
  color: var(--base-5)
}
.dropdown__button.show .icon:last-of-type {
  transform: rotate(-180deg)
}
.dropdown__button-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: var(--base-2)
}
.dropdown__list {
  display: none;
  position: absolute;
  width: 100%;
  background-color: var(--base-5);
  outline: solid 1px var(--base-1);
  margin: 0;
  padding: 0;
  list-style-type: none
}
.dropdown__list.show {
  display: block;
  margin-top: -3px!important;
  z-index: 2
}
.dropdown__link {
  transition: all .25s;
  text-decoration: none;
  padding: var(--sm-4) var(--sm-3);
  display: flex;
  align-items: center;
  gap: var(--xs-1);
  font-size: var(--body-sm-fs);
  line-height: var(--body-sm-lh)
}
.dropdown__link .icon {
  font-size: 2.4rem;
  line-height: 2.4rem
}
.dropdown__link:hover {
  background-color: var(--base-4);
  color: var(--base-1)
}
.dropdown__link:focus,
.dropdown__link:focus-visible,
.dropdown__link:focus-within {
  background-color: var(--base-2);
  color: var(--base-5)
}
.dropdown__link.active {
  background-color: var(--base-2);
  color: var(--base-5)
}
.form-field__wrapper {
  display: flex
}
.form-field__label {
  color: var(--color-utility)
}
.form-field__input,
.form-field__search,
.form-field__textarea {
  background-color: var(--base-5);
  font-size: var(--body-s-font-size);
  line-height: var(--body-s-line-height);
  font-weight: var(--body-s-weight);
  letter-spacing: var(--body-s-letter-spacing);
  border-radius: var(--input-radius);
  border: none;
  outline: 1px solid var(--dark-25);
  color: var(--base-2);
  width: 100%;
  padding: var(--sm-3) var(--sm-2);
  transition: all .25s
}
.form-field__input:hover,
.form-field__search:hover,
.form-field__textarea:hover {
  outline-color: var(--base-1);
  color: var(--primary-1)
}
.form-field__input:focus-within,
.form-field__search:focus-within,
.form-field__textarea:focus-within {
  outline: 1px solid var(--base-1);
  box-shadow: none;
  color: var(--primary-1)
}
.form-field__input:focus-visible,
.form-field__search:focus-visible,
.form-field__textarea:focus-visible {
  outline: 2px solid var(--base-2);
  box-shadow: none;
  color: var(--primary-1)
}
.form-field__input:not(:-moz-placeholder),
.form-field__search:not(:-moz-placeholder),
.form-field__textarea:not(:-moz-placeholder) {
  outline-color: var(--base-1);
  color: var(--primary-1)
}
.form-field__input:not(:placeholder-shown),
.form-field__search:not(:placeholder-shown),
.form-field__textarea:not(:placeholder-shown) {
  outline-color: var(--base-1);
  color: var(--primary-1)
}
.form-field__input:disabled,
.form-field__search:disabled,
.form-field__textarea:disabled {
  background-color: var(--dark-5);
  color: var(--dark-50);
  outline-color: var(--base-3)
}
.form-field__input:invalid,
.form-field__search:invalid,
.form-field__textarea:invalid {
  outline-color: var(--error);
  color: var(--color-body)
}
.form-field__input:invalid + span,
.form-field__search:invalid + span,
.form-field__textarea:invalid + span {
  display: block
}
.form-field__input::-webkit-input-placeholder,
.form-field__search::-webkit-input-placeholder,
.form-field__textarea::-webkit-input-placeholder {
  color: var(--base-2)
}
.form-field__textarea {
  max-height: 12rem;
  padding: var(--sm-3) var(--sm-4) var(--xs-1) var(--sm-2)
}
.form-field__search {
  outline-offset: 0
}
.form-field__search-button {
  line-height: 100%;
  border: none;
  background-color: var(--base-5);
  right: var(--sm-4);
  top: 50%;
  transform: translateY(-50%)
}
.form-field__search-button .icon {
  color: var(--base-2)
}
.form-field__message {
  display: none
}
.form-field__counter {
  position: absolute;
  right: var(--sm-2);
  bottom: var(--xs-1)
}
.form-field__autocomplete {
  width: 100%
}
.form-field__autocomplete-list {
  max-height: 22rem;
  overflow-y: auto
}
.form-field__autocomplete-link {
  color: var(--base-2);
  text-decoration: none;
  display: block
}
.form-field__autocomplete-link:hover {
  text-decoration: underline;
  color: var(--base-1)
}
.form-field--success .form-field__wrapper {
  position: relative
}
.form-field--success .form-field__wrapper::after {
  font-family: icomoon!important;
  content: "\e91d";
  position: absolute;
  width: 2.4rem;
  height: 2.4rem;
  line-height: 2.4rem;
  right: var(--sm-2);
  bottom: var(--sm-3);
  background-color: var(--success);
  color: var(--base-5);
  text-align: center
}
.form-field--error .form-field__wrapper {
  position: relative
}
.form-field--error .form-field__wrapper::after {
  font-family: icomoon!important;
  content: "\e909";
  position: absolute;
  width: 2.4rem;
  height: 2.4rem;
  line-height: 2.4rem;
  right: var(--sm-2);
  bottom: var(--sm-3);
  background-color: var(--error);
  color: var(--base-5);
  text-align: center
}
.form-field--error .form-field__input {
  outline-color: var(--error)
}
.form-field--error .form-field__message {
  display: block
}
.form-field--hide-status-icon .form-field__wrapper::after {
  display: none
}
.form-field--checkbox .form-field__label {
  display: flex;
  align-items: center;
  padding: var(--sm-4) var(--sm-3) var(--sm-4);
  width: 100%;
  color: var(--color-body)
}
.form-field--checkbox .form-field__label::before {
  content: "";
  background: var(--secondary-2);
  width: 2.4rem;
  height: 2.4rem;
  min-width: 2.4rem;
  min-height: 2.4rem;
  border: solid 4px var(--base-5);
  transition: all .25s;
  margin-right: var(--xs-1);
  color: var(--base-5);
  font-family: icomoon;
  font-weight: 700;
  line-height: 16px;
  font-size: 1.2rem;
  text-align: center
}
.form-field--checkbox .form-field__label:hover::before {
  background-color: var(--primary-4)
}
.form-field--checkbox .form-field__label:focus-visible {
  outline: 0
}
.form-field--checkbox .form-field__checkbox {
  width: 0;
  height: 0;
  opacity: 0
}
.form-field--checkbox .form-field__checkbox:focus-visible + .form-field__label {
  outline: solid 2px var(--base-2);
  outline-offset: -2px
}
.form-field--checkbox .form-field__checkbox:checked + .form-field__label::before {
  content: "\e91e";
  background: var(--primary-4)
}
.form-field--checkbox .form-field__checkbox:disabled + .form-field__label {
  pointer-events: none
}
.form-field--checkbox .form-field__checkbox:disabled + .form-field__label::before {
  background: var(--base-2)
}
.form-field--checkbox-multiline .form-field__label {
  align-items: normal
}
.form-field--radio {
  width: -moz-max-content;
  width: max-content
}
.form-field--radio .form-field__wrapper {
  display: flex;
  align-items: center
}
.form-field--radio .form-field__wrapper:focus-within label {
  outline: 1px solid var(--base-1)
}
.form-field--radio .form-field__ghost {
  display: inline-block;
  background-color: var(--base-3);
  width: 2rem;
  height: 2rem;
  transition: all .25s;
  margin-right: var(--xs-1);
  border-radius: 100%;
  position: relative
}
.form-field--radio .form-field__ghost::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  background-color: var(--base-5);
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%
}
.form-field--radio .form-field__radio {
  width: 0;
  height: 0;
  opacity: 0
}
.form-field--radio .form-field__radio:checked + span {
  background-color: var(--base-1)
}
.form-field--radio .form-field__radio:checked + span::after {
  content: ""
}
.form-field--radio .form-field__radio:disabled + span {
  background-color: var(--base-2)
}
.form-field--radio .form-field__radio:disabled + span::after {
  content: "";
  background-color: var(--base-5)
}
.form-field--radio:hover .form-field__ghost {
  background-color: var(--base-1)
}
.form-field--radio:focus-visible {
  box-shadow: inset 0 0 0 2px var(--base-2)
}
.form-field--radio:focus-visible .form-field__ghost {
  background-color: var(--base-1)
}
.form-field--autocomplete-visible .form-field__search {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0
}
.search__list {
  max-height: 25rem;
  overflow-y: auto
}
.search__link {
  color: var(--base-2)
}
.search__link:hover {
  color: var(--bas-1)
}
.form-check .form-check-input {
  height: 2.7rem;
  width: 5rem;
  border-radius: 2.5rem;
  border: none;
  box-shadow: unset;
  background-color: var(--base-3);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
  transition: all .3s ease-in-out
}
.form-check .form-check-input:checked {
  background-color: var(--base-1)
}
.form-check .form-check-input:focus-visible {
  outline: 1px solid var(--base-1)
}
.filter-dropdown {
  width: 100%;
  min-width: -moz-max-content;
  min-width: max-content;
  position: relative
}
.filter-dropdown__button {
  width: 100%;
  text-align: start;
  padding: var(--sm-3);
  background: var(--base-5);
  border: none;
  outline: solid 1px var(--base-3);
  outline-offset: -1px;
  color: var(--color-body-secondary);
  transition: all .25s;
  display: flex;
  align-items: center;
  gap: var(--xs-1);
  justify-content: space-between;
  text-transform: capitalize;
  border-radius: var(--input-radius)
}
.filter-dropdown__button:focus {
  outline: solid 1px var(--base-3)!important
}
.filter-dropdown__button .icon {
  font-size: var(--icon-font-size);
  line-height: var(--icon-font-size);
  transition: all .5s
}
.filter-dropdown__button:focus-within,
.filter-dropdown__button:hover {
  outline-color: var(--base-1)
}
.filter-dropdown__button:focus-within span,
.filter-dropdown__button:hover span {
  color: var(--base-1)
}
.filter-dropdown__button:disabled {
  color: var(--base-2);
  outline-color: var(--base-3);
  background-color: var(--base-4)
}
.filter-dropdown__button:disabled:hover {
  color: var(--base-2)
}
.filter-dropdown__button:disabled:hover span {
  color: var(--base-2)
}
.filter-dropdown__button.show {
  color: var(--base-1);
  outline-color: var(--base-1)
}
.filter-dropdown__button.show span {
  color: var(--base-1)
}
.filter-dropdown__button.show .icon:last-of-type {
  transform: rotate(-180deg)
}
.filter-dropdown__list {
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color: var(--base-5);
  outline: solid 1px var(--base-3);
  outline-offset: -1px;
  position: absolute;
  z-index: 2;
  width: 100%;
  min-width: -moz-max-content;
  min-width: max-content;
  height: 0;
  overflow: hidden;
  clip-path: inset(0 0 100% 0);
  transition: clip-path .5s ease,height .5s ease
}
.filter-dropdown__list.show {
  margin-top: -1px!important;
  height: auto;
  clip-path: inset(0 0 0 0);
  overflow-y: auto;
  max-height: 50rem
}
.filter-dropdown__item {
  transition: background-color .3s ease;
  text-transform: capitalize
}
.filter-dropdown__item:hover {
  background-color: var(--base-4)
}
.filter-dropdown__link {
  padding: var(--sm-4) var(--sm-3);
  text-decoration: none;
  display: block
}
.filter-dropdown__link:hover {
  color: var(--base-1)
}
@media (max-width:767.98px) {
  .filter-dropdown__list {
    position: static!important;
    transform: translate(0,0)!important
  }
}
@media (min-width:768px) {
  .filter-dropdown__button.show {
    color: var(--base-5);
    background-color: var(--primary-1)
  }
  .filter-dropdown__button.show span {
    color: var(--base-5)
  }
}
.filter-bar .filter-dropdown__list {
  outline: 0
}
.filter-bar .filter-dropdown__list.show {
  outline: solid 1px var(--base-3)
}
.filter-bar__mobile-button {
  background: var(--base-3);
  border: none
}
.filter-bar__mobile-button.collapsed .filter-bar__mobile-button-label-two {
  display: none
}
.filter-bar__mobile-button.collapsed .filter-bar__icon-close {
  display: none
}
.filter-bar__mobile-button.collapsed .filter-bar__icon-chevron {
  display: block
}
.filter-bar__mobile-button.collapsed .filter-bar__mobile-button-label-one {
  display: block
}
.filter-bar__mobile-button-label-one {
  display: none
}
.filter-bar__mobile-button-label-two {
  display: block
}
.filter-bar__icon-close {
  display: block
}
.filter-bar__icon-chevron {
  display: none
}
.filter-bar__right-contents {
  display: flex;
  flex-direction: column
}
@media (max-width:767.98px) {
  body:has(.filter-bar__mobile-button:not(.collapsed)) {
    overflow: hidden
  }
  .filter-bar__right {
    flex-wrap: wrap
  }
  .filter-bar__right:has(.filter-bar__mobile-button:not(.collapsed)) {
    position: fixed;
    z-index: 101;
    background: var(--base-3);
    width: 100%!important;
    left: 0;
    top: 0;
    height: 100%;
    padding: var(--sm-2) 1.5rem var(--sm-2) 2.8rem
  }
  .filter-bar__right:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__mobile-button {
    border-top: 0
  }
  .filter-bar__right:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__dropdown-container {
    max-height: 61.6rem;
    overflow-y: auto;
    padding-right: .9rem;
    width: 100%
  }
  .filter-bar__right-contents {
    flex-wrap: wrap;
    width: 100%
  }
  .filter-bar__dropdown-list {
    gap: 0!important
  }
  .filter-bar .filter-dropdown__button {
    outline: 1px solid var(--base-3)
  }
  .filter-bar .collapsing {
    overflow: hidden;
    flex-direction: column
  }
}
@media (min-width:768px) {
  .filter-bar__reset {
    width: 10%
  }
  .filter-bar__right-contents {
    width: 90%;
    position: relative
  }
  .filter-bar__right-contents.collapse:not(.show) {
    display: flex
  }
  .filter-bar .filter-dropdown {
    width: auto
  }
  .filter-bar .filter-dropdown__button .icon {
    color: var(--base-1)
  }
  .filter-bar .filter-dropdown__button.show .icon {
    color: var(--base-5)
  }
}