<span class="filter__close">
    <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
        <path d="M11.9596 6.95962C12.2134 6.70578 12.2134 6.29422 11.9596 6.04038C11.7057 5.78654 11.2942 5.78654 11.0403 6.04038L11.9596 6.95962ZM6.04033 11.0404C5.78649 11.2942 5.78649 11.7058 6.04033 11.9596C6.29417 12.2135 6.70573 12.2135 6.95957 11.9596L6.04033 11.0404ZM6.95967 6.04038C6.70583 5.78654 6.29428 5.78654 6.04043 6.04038C5.78659 6.29422 5.78659 6.70578 6.04043 6.95962L6.95967 6.04038ZM11.0404 11.9596C11.2943 12.2135 11.7058 12.2135 11.9597 11.9596C12.2135 11.7058 12.2135 11.2942 11.9597 11.0404L11.0404 11.9596ZM11.0403 6.04038L6.04033 11.0404L6.95957 11.9596L11.9596 6.95962L11.0403 6.04038ZM6.04043 6.95962L11.0404 11.9596L11.9597 11.0404L6.95967 6.04038L6.04043 6.95962ZM15.85 9C15.85 12.7832 12.7832 15.85 9 15.85V17.15C13.5011 17.15 17.15 13.5011 17.15 9H15.85ZM9 15.85C5.21685 15.85 2.15 12.7832 2.15 9H0.85C0.85 13.5011 4.49888 17.15 9 17.15V15.85ZM2.15 9C2.15 5.21685 5.21685 2.15 9 2.15V0.85C4.49888 0.85 0.85 4.49888 0.85 9H2.15ZM9 2.15C12.7832 2.15 15.85 5.21685 15.85 9H17.15C17.15 4.49888 13.5011 0.85 9 0.85V2.15Z" fill="#8E8C8C"/>
    </svg>
</span>

{{ form_start(searchForm, {'attr': {'data-controller': 'kinderFilter'}}) }}
    <div class="filter__input-wrap">
        {{ form_widget(searchForm.kinder, {'attr': {
            'class': 'filter__select',
            'data-controller' : 'selectpicker'
        }}) }}
    </div>
    <div class="filter__input-wrap">
        {{ form_widget(searchForm.order_by, {'attr': {'class': 'filter__select d-none'}}) }}
    </div>    
    <div class="filter__input-wrap">
        {{ form_widget(searchForm.name, {'attr': {'class': 'filter__select d-none'}}) }}
    </div>
    <div class="filter__input-wrap">
        {{ form_widget(searchForm.department, {'attr': {
            'class': 'filter__select',
            'data-live-search': 'true',
            'data-controller' : 'selectpicker'
        }}) }}
    </div>

    <div class="filter__input-wrap">
        {{ form_widget(searchForm.category, {'attr': {
            'class': 'filter__select',
            'data-live-search': 'true',
            'data-controller' : 'selectpicker',
            'data-placeholder': 'Категория'
        }}) }}
    </div>
    <div class="filter__input-wrap">
        {{ form_widget(searchForm.filial, {'attr': {
            'class': 'filter__select selectpicker',
            'data-controller' : 'selectpicker',
            'data-placeholder': 'Все клиники'
        }}) }}
    </div>
    <div class="filter__input-wrap" data-controller="quickDateRange">
        {{ form_widget(searchForm.current_date, {'attr': {
            'class': 'filter__input filter__input--date',
            'data-controller': 'datePicker',
            'data-quickDateRange-target': 'input',
            'range': 'true',
            'placeholder': 'Сегодня',
            'autocomplete': 'off'
        }}) }}
        <div class="d-flex gap-2 mt-2">
            <button
                type="button"
                class="btn btn-outline-secondary flex-fill submit-filter filter__btn"
                data-action="click->quickDateRange#today"
            >Сегодня</button>
            <button
                type="button"
                class="btn btn-outline-secondary flex-fill submit-filter filter__btn"
                data-action="click->quickDateRange#tomorrow"
            >Завтра</button>
        </div>
    </div>
    <div class="filter__input-wrap">
        {{ form_widget(searchForm.onlineMode, {'attr': {'class': 'filter__checkbox'}}) }}
        {{ form_label(searchForm.onlineMode, 'Онлайн консультация', {'label_attr': {'class': 'filter__checkbox-label'}}) }}
    </div>

    {{ form_row(searchForm._token) }}
    <div class="text-center">
        <button type="submit" class="btn btn-outline-secondary submit-filter filter__btn submit-filter">Найти</button>
    </div>
{{ form_end(searchForm) }}