<div class="filters" data-tooltip-class="pf2e">
    <div class="buy">
        <h3>
            {{@root.i18n 'buy'}}
            <a data-action="add-filter" data-type="buy"><i class="fa-solid fa-plus"></i></a>
        </h3>
        {{#each buyFilters as |filter|}}
        {{> filter filter=filter type="buy"}}
        {{/each}}
    </div>
    <hr>
    <div class="sell">
        <h3>
            {{@root.i18n 'sell'}}
            <a data-action="add-filter" data-type="sell"><i class="fa-solid fa-plus"></i></a>
        </h3>
        {{#each sellFilters as |filter|}}
        {{> filter filter=filter type="sell"}}
        {{/each}}
    </div>
</div>

{{#*inline "filter"}}
<fieldset class="filter" data-type="{{type}}" data-id="{{filter.id}}">
    <div class="group">
        <label>
            {{@root.i18n 'name'}}
            <input type="text" name="name" value="{{filter.name}}" {{disabled filter.locked}}>
        </label>
        <div class="controls">
            <div class="carets">
                {{#if filter.cannotUp}}
                <span>
                    <i class="fa-solid fa-caret-up"></i>
                </span>
                {{else}}
                <a data-action="move-filter" data-direction="up">
                    <i class="fa-solid fa-caret-up"></i>
                </a>
                {{/if}}
                {{#if filter.cannotDown}}
                <span>
                    <i class="fa-solid fa-caret-down"></i>
                </span>
                {{else}}
                <a data-action="move-filter" data-direction="down">
                    <i class="fa-solid fa-caret-down"></i>
                </a>
                {{/if}}
            </div>
            {{#if filter.locked}}
            <span>
                <i class="fa-solid fa-pen-to-square"></i>
            </span>
            <span>
                <i class="fa-solid fa-trash"></i>
            </span>
            {{else}}
            <a data-action="edit-filter">
                <i class="fa-solid fa-pen-to-square"></i>
            </a>
            <a data-action="delete-filter">
                <i class="fa-solid fa-trash"></i>
            </a>
            {{/if}}
        </div>
    </div>
    <div class="group">
        <label data-tooltip="{{@root.i18n.path 'enabled.tooltip'}}">
            {{@root.i18n 'enabled.label'}}
            <input type="checkbox" name="enabled" {{checked filter.enabled}}>
        </label>
        {{#if (and (eq type 'buy') (not filter.locked))}}
        <label data-tooltip="{{@root.i18n.path 'useDefault.tooltip'}}">
            {{@root.i18n 'useDefault.label'}}
            <input type="checkbox" name="useDefault" {{checked filter.useDefault}}>
        </label>
        {{/if}}
    </div>
    <div class="group">
        <label data-tooltip="{{@root.i18n.path 'ratio.tooltip'}}">
            {{@root.i18n 'ratio.label'}}
            <input type="number" name="ratio" value="{{filter.ratio}}" {{#with (lookup @root.ratios
                type)}} min="{{min}}" max="{{max}}" step="0.1" {{/with}}>
            {{#if (and (eq type 'buy') filter.locked)}}
            <i class="fa-solid fa-coin treasure"
                data-tooltip="{{@root.i18n.path 'ratio.treasure'}}"></i>
            {{/if}}
        </label>
        <label data-tooltip="{{@root.i18n.path (concat 'purse.tooltip.' type)}}">
            {{@root.i18n 'purse.label'}}
            <input type="number" name="purse" value="{{filter.purse}}" min="0" step="1" {{disabled
                (eq type 'sell' )}}>
        </label>
    </div>
</fieldset>
{{/inline}}