.header-inputs-wrapper.flex.items-center.font-medium.text-base(:class="{ open: isOpen }")
.select-container(@click="changeState", v-click-outside="closeOptions")
.select-wrapper.flex.items-center.cursor-pointer.mx-4.my-2
.icon-wrapper.icon-search.flex.text-lg.justify-center.items-center
span.custom-input.select-input.inline-block.box-border.align-middle.pl-2.pr-1 {{ selectedFilter }}
.arrow.icon-down-arrow.text-xsm.mt-px.flex.justify-center.items-center
.options-wrapper.flex.flex-col.box-border.p-4.mt-1(v-if="isOpen")
.option-list.cursor-pointer.flex.flex-row.mb-4(
v-for="filter in filters",
:key="filter", @click="selectFilter(filter)"
)
.icon-wrapper.mr-2.flex.justify-center
.icon-ok.text-xs.flex.justify-center.items-center(v-if="filter === selectedFilter")
.flex.items-center {{ filter }}
q-input.px-4(
type="text",
placeholder="Искать ...",
:input-style="{color: 'var(--btn-blue-color)'}",
borderless,
square
)