@layer molecules {
  .dropdown {
    width: 100%;
    max-width: 60rem;
    min-width: 21.5rem;
    position: relative;
  }
  .dropdown__button {
    width: 100%;
    text-align: start;
    padding: var(--ui-input-input-field-padding-top-bottom) var(--ui-input-input-field-padding-left-right);
    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(--ui-input-input-field-bg);
    border: solid calc(var(--ui-input-input-field-border-weight) * 1px) var(--ui-input-input-field-border);
    outline: none;
    color: var(--ui-input-input-field-text);
    transition: all 0.25s;
    display: flex;
    align-items: center;
    gap: var(--ui-input-input-field-text-icon-gap);
    border-radius: var(--ui-input-input-field-border-radius);
  }
  .dropdown__button .icon {
    font-size: var(--icon-m);
    color: var(--ui-input-input-field-text);
  }
  .dropdown__button .icon:last-of-type {
    transition: all 0.5s;
  }
  .dropdown__button:hover {
    border-color: var(--ui-input-input-field-hover-border);
    color: var(--ui-input-input-field-hover-text);
  }
  .dropdown__button:hover span {
    color: var(--ui-input-input-field-hover-text);
  }
  .dropdown__button:hover .icon {
    color: var(--ui-input-input-field-hover-icon);
  }
  .dropdown__button:focus-within {
    border-color: var(--ui-input-input-field-active-border);
  }
  .dropdown__button:disabled {
    color: var(--ui-input-input-field-disabled-text);
    border-color: var(--ui-input-input-field-disabled-border);
    background-color: var(--ui-input-input-field-disabled-bg);
  }
  .dropdown__button:disabled:hover {
    color: var(--ui-input-input-field-disabled-text);
  }
  .dropdown__button:disabled:hover span {
    color: var(--ui-input-input-field-disabled-text);
  }
  .dropdown__button.show {
    background-color: var(--ui-input-input-field-active-bg);
    color: var(--ui-input-input-field-active-text);
    border-color: transparent;
    border-bottom-color: var(--ui-input-input-field-active-border);
    border-radius: 0;
  }
  .dropdown__button.show span {
    color: var(--ui-input-input-field-active-text);
  }
  .dropdown__button.show .icon {
    color: var(--ui-input-input-field-active-icon);
  }
  .dropdown__button.show .icon:last-of-type {
    transform: rotate(-180deg);
  }
  .dropdown__button.show + .dropdown__list {
    box-shadow: 0 var(--ui-input-dropdown-shadow-offset) var(--ui-input-dropdown-shadow-blur) var(--ui-input-dropdown-shadow);
    border-radius: 0 0 var(--ui-input-dropdown-border-radius) var(--ui-input-dropdown-border-radius);
  }
  .dropdown__button-label {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: var(--ui-input-input-field-text);
  }
  .dropdown__list {
    display: none;
    position: absolute;
    width: 100%;
    background-color: var(--ui-input-dropdown-bg);
    box-shadow: none;
    border-radius: var(--ui-input-dropdown-border-radius);
    outline: none;
    margin: 0;
    padding: 0;
    list-style-type: none;
  }
  .dropdown__list.show {
    display: block;
    margin-top: 0 !important;
    z-index: 2;
  }
  .dropdown__link {
    transition: all 0.25s;
    text-decoration: none;
    padding: var(--sm-4) var(--sm-3);
    display: flex;
    align-items: center;
    gap: var(--xs-1);
    font-size: var(--body-s-font-size);
    line-height: var(--body-s-line-height);
    color: var(--ui-input-dropdown-items-default-text);
  }
  .dropdown__link .icon {
    font-size: var(--icon-m);
    line-height: var(--icon-m);
  }
  .dropdown__link:hover {
    background-color: var(--ui-input-dropdown-items-hover-bg);
    color: var(--ui-input-dropdown-items-hover-text);
  }
  .dropdown__link:focus, .dropdown__link:focus-visible, .dropdown__link:focus-within {
    background-color: var(--ui-input-dropdown-items-active-bg);
    color: var(--ui-input-dropdown-items-active-text);
  }
  .dropdown__link.active {
    background-color: var(--ui-input-dropdown-items-active-bg);
    color: var(--ui-input-dropdown-items-active-text);
    font-weight: var(--primitive-weight-bold);
  }
  .dropdown__link.active:hover {
    background-color: var(--ui-input-dropdown-items-hover-bg);
    color: var(--ui-input-dropdown-items-hover-text);
  }
  .dropdown .form-field--checkbox .form-field__label {
    padding: var(--sm-4) var(--sm-3);
  }
  .dropdown .form-field--checkbox .form-field__label:hover {
    background-color: var(--ui-input-dropdown-items-hover-bg);
  }
  .form-field__label {
    color: var(--ui-input-input-field-input-label);
  }
  .form-field__wrapper {
    display: flex;
  }
  .form-field__input, .form-field__textarea, .form-field__search {
    background-color: var(--ui-input-input-field-bg);
    font-size: var(--body-s-font-size);
    line-height: var(--body-s-line-height);
    border-radius: var(--ui-input-input-field-border-radius);
    border: none;
    outline: calc(var(--ui-input-input-field-border-weight) * 1px) solid var(--ui-input-input-field-border);
    color: var(--ui-input-input-field-text);
    width: 100%;
    padding: var(--ui-input-input-field-padding-top-bottom) var(--ui-input-input-field-padding-left-right);
    transition: all 0.25s;
  }
  .form-field__input:hover, .form-field__textarea:hover, .form-field__search:hover {
    background-color: var(--ui-input-input-field-hover-bg);
    outline-color: var(--ui-input-input-field-hover-border);
    color: var(--ui-input-input-field-hover-text);
  }
  .form-field__input:focus-within, .form-field__textarea:focus-within, .form-field__search:focus-within {
    outline-color: var(--ui-input-input-field-active-border);
    box-shadow: none;
    color: var(--ui-input-input-field-active-text);
    background-color: var(--ui-input-input-field-active-bg);
  }
  .form-field__input:focus-visible, .form-field__textarea:focus-visible, .form-field__search:focus-visible {
    outline-color: var(--ui-input-input-field-active-border);
    box-shadow: none;
    color: var(--ui-input-input-field-active-text);
  }
  .form-field__input:not(:-moz-placeholder), .form-field__textarea:not(:-moz-placeholder), .form-field__search:not(:-moz-placeholder) {
    outline-color: var(--ui-input-input-field-active-border);
    color: var(--ui-input-input-field-active-text);
  }
  .form-field__input:not(:placeholder-shown), .form-field__textarea:not(:placeholder-shown), .form-field__search:not(:placeholder-shown) {
    outline-color: var(--ui-input-input-field-active-border);
    color: var(--ui-input-input-field-active-text);
  }
  .form-field__input:disabled, .form-field__textarea:disabled, .form-field__search:disabled {
    background-color: var(--ui-input-input-field-disabled-bg);
    color: var(--ui-input-input-field-disabled-text);
    outline-color: var(--ui-input-input-field-disabled-border);
  }
  .form-field__input:invalid, .form-field__textarea:invalid, .form-field__search:invalid {
    outline-color: var(--error);
    color: var(--error);
  }
  .form-field__input:invalid + span, .form-field__textarea:invalid + span, .form-field__search:invalid + span {
    display: block;
  }
  .form-field__textarea {
    max-height: 12rem;
  }
  .form-field__search {
    outline-offset: 0;
  }
  .form-field__search::-webkit-search-cancel-button {
    -webkit-appearance: none;
            appearance: none;
    display: none;
  }
  .form-field__search:not(:-moz-placeholder) ~ .form-field__search-button {
    display: none;
  }
  .form-field__search:not(:placeholder-shown) ~ .form-field__search-button {
    display: none;
  }
  .form-field__search:not(:-moz-placeholder) ~ .form-field__clear-button {
    display: block;
  }
  .form-field__search:not(:placeholder-shown) ~ .form-field__clear-button {
    display: block;
  }
  .form-field__search-button, .form-field__clear-button {
    line-height: 100%;
    border: none;
    background-color: var(--ui-input-input-field-bg);
    inset-inline-end: var(--sm-4);
    top: 50%;
    transform: translateY(-50%);
  }
  .form-field__search-button .icon, .form-field__clear-button .icon {
    color: var(--ui-input-input-field-icon);
  }
  .form-field__search-button:disabled, .form-field__clear-button:disabled {
    background-color: var(--ui-input-input-field-disabled-bg);
  }
  .form-field__search-button:disabled .icon, .form-field__clear-button:disabled .icon {
    color: var(--ui-input-input-field-disabled-icon);
  }
  .form-field__clear-button {
    display: none;
  }
  .form-field__clear-button .icon {
    color: var(--ui-input-input-field-active-icon);
  }
  .form-field__message {
    display: none;
  }
  .form-field__counter {
    position: absolute;
    inset-inline-end: 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(--ui-input-input-field-text);
    text-decoration: none;
    display: block;
  }
  .form-field__autocomplete-link:hover {
    text-decoration: underline;
    color: var(--ui-input-input-field-active-text);
  }
  .form-field--error .form-field__wrapper {
    position: relative;
  }
  .form-field--error .form-field__wrapper::after {
    font-family: icomoon !important;
    content: "\e916";
    position: absolute;
    width: 2.4rem;
    height: 2.4rem;
    line-height: 2.4rem;
    inset-inline-end: var(--sm-2);
    bottom: var(--sm-3);
    background-color: var(--error);
    color: var(--ui-input-input-field-bg);
    text-align: center;
  }
  .form-field--error .form-field__input, .form-field--error .form-field__textarea {
    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) 0;
    width: 100%;
    color: var(--ui-input-selectors-text);
  }
  .form-field--checkbox .form-field__label::before {
    content: "";
    background: transparent;
    width: 2.4rem;
    height: 2.4rem;
    min-width: 2.4rem;
    min-height: 2.4rem;
    border: solid calc(var(--general-focus-border-weight) * 1px) var(--ui-input-selectors-icon);
    border-radius: 0;
    transition: all 0.25s;
    margin-inline-end: var(--xs-1);
    color: var(--ui-input-selectors-icon);
    font-family: icomoon;
    font-weight: var(--primitive-weight-bold);
    font-size: var(--label-xs-font-size);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .form-field--checkbox .form-field__label:hover {
    color: var(--ui-input-selectors-hover-text);
  }
  .form-field--checkbox .form-field__label:hover::before {
    border-color: var(--ui-input-selectors-hover-icon);
  }
  .form-field--checkbox .form-field__label:focus-visible {
    outline: none;
  }
  .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 calc(var(--general-focus-border-weight) * 1px) var(--ui-input-selectors-active-icon);
    outline-offset: calc(var(--general-focus-border-weight) * -1px);
  }
  .form-field--checkbox .form-field__checkbox:checked + .form-field__label {
    color: var(--ui-input-selectors-active-text);
  }
  .form-field--checkbox .form-field__checkbox:checked + .form-field__label::before {
    content: "\e930";
    background: var(--ui-input-selectors-active-icon);
    border-color: var(--ui-input-selectors-active-icon);
    color: var(--general-bg);
  }
  .form-field--checkbox .form-field__checkbox:disabled + .form-field__label {
    pointer-events: none;
    color: var(--ui-input-selectors-disabled-text);
  }
  .form-field--checkbox .form-field__checkbox:disabled + .form-field__label::before {
    border-color: var(--ui-input-selectors-disabled-icon);
    background: var(--ui-input-selectors-disabled-icon);
  }
  .form-field--checkbox-multiline .form-field__label {
    align-items: normal;
  }
  .form-field--radio {
    width: -moz-max-content;
    width: max-content;
    color: var(--ui-input-selectors-text);
    padding: var(--ui-input-input-field-padding-top-bottom) var(--ui-input-input-field-padding-left-right);
  }
  .form-field--radio .form-field__wrapper {
    display: flex;
    align-items: center;
    gap: var(--ui-input-input-field-text-icon-gap);
    position: relative;
  }
  .form-field--radio .form-field__ghost {
    display: inline-block;
    width: var(--icon-m);
    height: var(--icon-m);
    min-width: var(--icon-m);
    min-height: var(--icon-m);
    transition: all 0.25s;
    border-radius: 100%;
    position: relative;
    pointer-events: none;
    border: solid calc(var(--general-focus-border-weight) * 1px) var(--ui-input-selectors-icon);
    background-color: transparent;
  }
  .form-field--radio .form-field__ghost::after {
    position: absolute;
    top: 50%;
    inset-inline-start: 50%;
    transform: translate(-50%, -50%);
    background-color: transparent;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
  }
  .form-field--radio .form-field__radio {
    position: absolute;
    inset-inline-start: 0;
    top: 50%;
    transform: translateY(-50%);
    width: var(--icon-m);
    height: var(--icon-m);
    opacity: 0;
    cursor: pointer;
    z-index: 1;
    margin: 0;
  }
  .form-field--radio .form-field__radio:checked + span {
    border-color: var(--ui-input-selectors-active-icon);
  }
  .form-field--radio .form-field__radio:checked + span::after {
    content: "";
    background-color: var(--ui-input-selectors-active-icon);
  }
  .form-field--radio .form-field__radio:checked ~ label {
    color: var(--ui-input-selectors-active-text);
    font-weight: var(--primitive-weight-bold);
  }
  .form-field--radio .form-field__radio:disabled + span {
    border-color: var(--ui-input-selectors-disabled-icon);
  }
  .form-field--radio .form-field__radio:disabled + span::after {
    content: "";
    background-color: var(--ui-input-selectors-disabled-icon);
  }
  .form-field--radio .form-field__radio:disabled ~ label {
    color: var(--ui-input-selectors-disabled-text);
    pointer-events: none;
  }
  .form-field--radio:hover {
    color: var(--ui-input-selectors-hover-text);
  }
  .form-field--radio:hover .form-field__ghost {
    border-color: var(--ui-input-selectors-hover-icon);
  }
  .form-field--radio:has(:focus-visible) {
    outline: solid calc(var(--general-focus-border-weight) * 1px) var(--general-focus-border);
    outline-offset: calc(var(--general-focus-border-weight) * -1px);
  }
  .form-field--autocomplete-visible .form-field__search {
    border-end-start-radius: 0;
    border-end-end-radius: 0;
  }
  .search__list {
    max-height: 25rem;
    overflow-y: auto;
  }
  .search__link {
    color: var(--ui-input-dropdown-items-default-text);
  }
  .search__link:hover {
    color: var(--ui-input-dropdown-items-hover-text);
  }
  .form-check .form-check-label {
    color: var(--ui-input-selectors-text);
  }
  .form-check .form-check-input {
    height: 2.7rem;
    width: 5rem;
    border-radius: 2.5rem;
    border: solid 2px var(--ui-input-selectors-icon);
    box-shadow: unset;
    background-color: transparent !important;
    background-image: none !important;
    transition: all 0.3s ease-in-out;
    position: relative;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }
  .form-check .form-check-input::after {
    content: "";
    position: absolute;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background-color: var(--ui-input-selectors-icon);
    top: 50%;
    inset-inline-start: 0.3rem;
    transform: translateY(-50%);
    transition: all 0.3s ease-in-out;
  }
  .form-check .form-check-input:checked {
    border-color: var(--ui-input-selectors-active-icon);
  }
  .form-check .form-check-input:checked::after {
    background-color: var(--ui-input-selectors-active-icon);
    inset-inline-start: calc(100% - 1.9rem);
  }
  .form-check .form-check-input:focus-visible {
    outline: calc(var(--ui-input-input-field-border-weight) * 1px) solid var(--ui-input-selectors-active-icon);
  }
  .filter-dropdown {
    width: 100%;
    position: relative;
  }
  .filter-dropdown__button {
    width: 100%;
    text-align: start;
    padding: var(--ui-input-input-field-padding-top-bottom) var(--ui-input-input-field-padding-left-right);
    background: var(--ui-input-input-field-bg);
    border: solid calc(var(--ui-input-input-field-border-weight) * 1px) var(--ui-input-input-field-border);
    outline: none;
    color: var(--ui-input-input-field-text);
    transition: all 0.25s;
    display: flex;
    align-items: center;
    gap: var(--sm-2);
    justify-content: space-between;
    text-transform: capitalize;
    border-radius: var(--ui-input-input-field-border-radius);
  }
  .filter-dropdown__button .icon {
    font-size: var(--icon-font-size);
    line-height: var(--icon-font-size);
    font-weight: var(--primitive-weight-bold);
    transition: all 0.5s;
    color: var(--ui-input-input-field-icon);
  }
  .filter-dropdown__button:hover, .filter-dropdown__button:focus-within {
    background-color: var(--ui-input-input-field-hover-bg);
    border-color: var(--ui-input-input-field-hover-border);
    color: var(--ui-input-input-field-hover-text);
  }
  .filter-dropdown__button:hover span, .filter-dropdown__button:focus-within span {
    color: var(--ui-input-input-field-hover-text);
  }
  .filter-dropdown__button:hover .icon, .filter-dropdown__button:focus-within .icon {
    color: var(--ui-input-input-field-hover-icon);
  }
  .filter-dropdown__button:focus-visible {
    border-color: var(--ui-input-input-field-active-border);
    box-shadow: inset 0 0 0 calc(var(--general-focus-border-weight) * 1px) var(--ui-input-input-field-active-border);
  }
  .filter-dropdown__button:disabled {
    color: var(--ui-input-input-field-disabled-text);
    border-color: var(--ui-input-input-field-disabled-border);
    background-color: var(--ui-input-input-field-disabled-bg);
  }
  .filter-dropdown__button:disabled:hover {
    color: var(--ui-input-input-field-disabled-text);
  }
  .filter-dropdown__button:disabled:hover span {
    color: var(--ui-input-input-field-disabled-text);
  }
  .filter-dropdown__button.show {
    color: var(--ui-input-input-field-active-text);
    border-color: transparent;
    border-bottom-color: var(--ui-input-input-field-active-border);
    background-color: var(--ui-input-input-field-active-bg);
    border-radius: 0;
    box-shadow: 0 var(--ui-input-dropdown-shadow-offset) var(--ui-input-dropdown-shadow-blur) var(--ui-input-dropdown-shadow);
  }
  .filter-dropdown__button.show span {
    color: var(--ui-input-input-field-active-text);
  }
  .filter-dropdown__button.show .icon {
    color: var(--ui-input-input-field-active-icon);
  }
  .filter-dropdown__button.show .icon:last-of-type {
    transform: rotate(-180deg);
  }
  .filter-dropdown__button.show + .filter-dropdown__list {
    box-shadow: 0 var(--ui-input-dropdown-shadow-offset) var(--ui-input-dropdown-shadow-blur) var(--ui-input-dropdown-shadow);
    border-radius: 0 0 var(--ui-input-dropdown-border-radius) var(--ui-input-dropdown-border-radius);
  }
  .filter-dropdown__list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    background-color: var(--ui-input-dropdown-bg);
    outline: none;
    box-shadow: none;
    border-radius: var(--ui-input-dropdown-border-radius);
    position: absolute;
    z-index: 2;
    inset-inline: 0;
    top: 100%;
    min-width: 100%;
    max-height: 0;
    overflow: hidden;
    clip-path: inset(0 0 100% 0);
    transition: clip-path 0.5s ease, max-height 0.5s ease;
  }
  @media (prefers-reduced-motion: reduce) {
    .filter-dropdown__list {
      transition: none;
    }
  }
  .filter-dropdown__list.show {
    margin-top: 0 !important;
    clip-path: inset(calc(-1 * var(--ui-input-dropdown-shadow-blur)) calc(-1 * var(--ui-input-dropdown-shadow-blur)) calc(-1 * (var(--ui-input-dropdown-shadow-offset) + var(--ui-input-dropdown-shadow-blur))) calc(-1 * var(--ui-input-dropdown-shadow-blur)));
    overflow-y: auto;
    max-height: 50rem;
  }
  .filter-dropdown__item {
    transition: background-color 0.3s ease;
    text-transform: capitalize;
  }
  .filter-dropdown__item:hover {
    background-color: var(--ui-input-dropdown-items-hover-bg);
  }
  .filter-dropdown__link {
    padding: var(--sm-4) var(--sm-3);
    text-decoration: none;
    display: block;
    color: var(--ui-input-dropdown-items-default-text);
  }
  .filter-dropdown__link.active {
    background-color: var(--ui-input-dropdown-items-active-bg);
    color: var(--ui-input-dropdown-items-active-text);
    font-weight: var(--primitive-weight-bold);
  }
  .filter-dropdown__link:hover {
    color: var(--ui-input-dropdown-items-hover-text);
  }
  .filter-dropdown .form-field--checkbox .form-field__label {
    padding: var(--sm-4) var(--sm-3);
  }
  .filter-dropdown .form-field--checkbox .form-field__label:hover {
    background-color: var(--ui-input-dropdown-items-hover-bg);
  }
  .filter-dropdown .form-field--checkbox .form-field__checkbox:checked + .form-field__label {
    background-color: var(--ui-input-dropdown-items-active-bg);
    color: var(--ui-input-dropdown-items-active-text);
    font-weight: var(--primitive-weight-bold);
  }
  .filter-dropdown .form-field--checkbox .form-field__checkbox:checked + .form-field__label:hover {
    background-color: var(--ui-input-dropdown-items-hover-bg);
    color: var(--ui-input-dropdown-items-hover-text);
  }
  .filter-dropdown__icon-clear {
    display: none;
    color: var(--ui-input-input-field-active-icon);
    font-size: var(--icon-font-size);
    line-height: var(--icon-font-size);
    font-weight: var(--primitive-weight-bold);
    cursor: pointer;
  }
  .filter-dropdown--selected .filter-dropdown__button:not(.show) {
    border-color: var(--ui-input-input-field-active-border);
  }
  .filter-dropdown--selected .filter-dropdown__button:not(.show) .filter-dropdown__icon-chevron {
    display: none;
  }
  .filter-dropdown--selected .filter-dropdown__button:not(.show) .filter-dropdown__icon-clear {
    display: block;
  }
  @media (max-width: 767.98px) {
    .filter-dropdown:has(.filter-dropdown__button.show) {
      box-shadow: 0 var(--ui-input-dropdown-shadow-offset) var(--ui-input-dropdown-shadow-blur) var(--ui-input-dropdown-shadow);
    }
    .filter-dropdown__button.show {
      box-shadow: none;
    }
    .filter-dropdown__button.show:focus-visible {
      box-shadow: inset 0 0 0 calc(var(--general-focus-border-weight) * 1px) var(--ui-input-input-field-active-border);
    }
    .filter-dropdown__button.show + .filter-dropdown__list {
      box-shadow: none;
    }
    .filter-dropdown__list {
      position: static !important;
      transform: translate(0, 0) !important;
    }
    .filter-dropdown__list.show {
      clip-path: inset(0);
    }
  }
  @media (min-width: 768px) {
    .filter-dropdown__button.show {
      color: var(--ui-input-input-field-active-text);
      background-color: var(--ui-input-input-field-active-bg);
      border-color: transparent;
      border-bottom-color: var(--ui-input-input-field-active-border);
      border-radius: 0;
    }
    .filter-dropdown__button.show span {
      color: var(--ui-input-input-field-active-text);
    }
  }
  .filter-bar {
    background: var(--ui-filter-bar-bkg);
    box-shadow: 0 var(--ui-filter-bar-shadow-offset) var(--ui-filter-bar-shadow-blur) var(--ui-filter-bar-shadow);
  }
  .filter-bar__mobile-button {
    background: var(--ui-buttons-primary-bg);
    color: var(--ui-buttons-primary-text);
    border: none;
    cursor: pointer;
    padding: var(--ui-buttons-primary-padding-top-bottom) var(--ui-buttons-primary-padding-left-right);
    font-family: var(--button-font-family);
    font-size: var(--button-font-size);
    font-weight: var(--button-weight);
    line-height: var(--button-line-height);
    letter-spacing: var(--button-letter-spacing);
    transition: all 0.25s;
  }
  .filter-bar__mobile-button:not(.collapsed) {
    background: var(--ui-buttons-primary-hover-bg);
    color: var(--ui-buttons-primary-hover-text);
  }
  .filter-bar__mobile-button:not(.collapsed) .filter-bar__mobile-button-label-one {
    display: none;
  }
  .filter-bar__mobile-button:not(.collapsed) .filter-bar__mobile-button-label-two {
    display: block;
  }
  .filter-bar__mobile-button:not(.collapsed) .filter-bar__icon-chevron {
    display: none;
  }
  .filter-bar__mobile-button:not(.collapsed) .filter-bar__icon-close {
    display: block;
  }
  .filter-bar__mobile-button-label-one {
    display: block;
  }
  .filter-bar__mobile-button-label-two {
    display: none;
  }
  .filter-bar__icon-filter, .filter-bar__icon-chevron, .filter-bar__icon-close {
    font-size: var(--icon-m);
    line-height: var(--icon-m);
  }
  .filter-bar__icon-chevron {
    display: block;
  }
  .filter-bar__icon-close {
    display: none;
  }
  .filter-bar__right-contents {
    display: flex;
    flex-direction: column;
  }
  @media (max-width: 767.98px) {
    body:has(.filter-bar .filter-bar__mobile-button:not(.collapsed)) {
      overflow: hidden;
    }
    .filter-bar {
      background: var(--ui-filter-bar-bkg);
    }
    .filter-bar__right {
      flex-wrap: wrap;
    }
    .filter-bar__right-contents {
      display: none;
      flex-wrap: wrap;
      width: 100%;
    }
    .filter-bar__right-contents.show, .filter-bar__right-contents.collapsing {
      display: flex;
    }
    .filter-bar:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__right {
      position: fixed;
      z-index: 96;
      background: var(--ui-filter-bar-bkg);
      width: 100% !important;
      inset-inline-start: 0;
      top: calc(var(--header-height, 0) * 1px);
      height: calc(100vh - var(--header-height, 0) * 1px);
      height: calc(100dvh - var(--header-height, 0) * 1px);
      padding-block: var(--sm-2);
      padding-inline: var(--margin-main-margin, 2.8rem);
      overflow-y: auto;
    }
    .filter-bar:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__dropdown-container {
      max-height: 61.6rem;
      overflow-y: auto;
      width: 100%;
    }
  }
  @media (min-width: 768px) {
    .filter-bar__reset {
      width: auto;
      white-space: nowrap;
    }
    .filter-bar__right-contents {
      display: flex;
      width: 90%;
      position: relative;
    }
    .filter-bar .filter-dropdown {
      width: auto;
    }
    .filter-bar .filter-dropdown__button .icon {
      color: var(--ui-input-input-field-icon);
    }
    .filter-bar .filter-dropdown__button.show .icon {
      color: var(--ui-input-input-field-active-icon);
    }
  }
  .filter-dropdown--enhanced .filter-dropdown__list {
    transition: clip-path 0.3s ease, max-height 0.3s ease;
  }
  .filter-dropdown--enhanced .filter-dropdown__button {
    gap: var(--ui-input-input-field-text-icon-gap);
  }
  .filter-dropdown--enhanced .filter-dropdown__button .icon {
    position: relative;
  }
  .filter-dropdown--enhanced .filter-dropdown__button .icon::after {
    content: "";
    position: absolute;
    inset-block: calc(-1 * var(--ui-input-input-field-padding-top-bottom));
    inset-inline: calc(-1 * var(--ui-input-input-field-text-icon-gap)) calc(-1 * var(--ui-input-input-field-padding-left-right));
  }
  .filter-dropdown--enhanced .count-label {
    display: inline-block;
    min-inline-size: 2.5ch;
    white-space: pre;
    font-variant-numeric: tabular-nums;
  }
  @media (min-width: 768px) {
    .filter-dropdown--enhanced .filter-dropdown__list {
      inset-inline-end: auto;
      width: -moz-max-content;
      width: max-content;
      min-width: 100%;
      max-width: 32rem;
      overflow-wrap: break-word;
    }
    .filter-dropdown--enhanced .filter-dropdown__link {
      padding-inline-end: var(--xs-1);
    }
    .filter-dropdown--enhanced .form-field--checkbox .form-field__label {
      padding-inline-end: var(--xs-1);
    }
  }
  @media (min-width: 768px) {
    .filter-bar--enhanced .filter-bar__left {
      flex: 0 0 30%;
      min-width: 20rem;
      align-self: flex-start;
    }
    .filter-bar--enhanced .filter-bar__right {
      flex: 0 1 auto;
    }
    .filter-bar--enhanced .filter-bar__dropdown-list {
      justify-content: flex-end;
    }
    .filter-bar--enhanced .filter-bar__reset {
      align-self: flex-start;
      margin-block-start: var(--ui-input-input-field-padding-top-bottom);
      padding-block-start: calc(var(--ui-input-input-field-border-weight) * 1px);
    }
    .filter-bar--enhanced .filter-bar__right-contents {
      width: auto;
      flex: 0 1 auto;
    }
  }
  @media (max-width: 767.98px) {
    .filter-dropdown--enhanced .filter-dropdown__list.show {
      max-height: min(50rem, 40dvh);
    }
    .filter-bar--enhanced:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__right {
      overflow: hidden;
      flex-wrap: nowrap;
    }
    .filter-bar--enhanced:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__right-contents {
      flex: 1 1 auto;
      min-height: 0;
      flex-wrap: nowrap;
    }
    .filter-bar--enhanced:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__dropdown-container {
      max-height: none;
      flex: 1 1 auto;
      min-height: 0;
    }
    .filter-bar--enhanced:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__apply {
      flex: 0 0 auto;
    }
    body:has(.menu.menu__hidden) .filter-bar--enhanced:has(.filter-bar__mobile-button:not(.collapsed)) .filter-bar__right {
      top: 0;
      height: 100vh;
      height: 100dvh;
    }
  }
}