<form class="flexcol" autocomplete="off">
    <div class="form-group">
        <label>{{localize gradualBoostsVariant.setting.name}}</label>
        <div class="form-fields">
            <input name="gradualBoostsVariant" type="checkbox" {{checked gradualBoostsVariant.value}} />
        </div>
        <p class="hint">{{localize gradualBoostsVariant.setting.hint}}</p>
    </div>

    <div class="form-group">
        <label>{{localize staminaVariant.setting.name}}</label>
        <div class="form-fields">
            <input name="staminaVariant" type="checkbox" {{checked staminaVariant.value}} />
        </div>
        <p class="hint">{{localize staminaVariant.setting.hint}}</p>
    </div>

    <div class="form-group">
        <label>{{localize freeArchetypeVariant.setting.name}}</label>
        <div class="form-fields">
            <input name="freeArchetypeVariant" type="checkbox" {{checked freeArchetypeVariant.value}} />
        </div>
        <p class="hint">{{localize freeArchetypeVariant.setting.hint}}</p>
    </div>

    <div class="form-group abp">
        <label>{{localize automaticBonusVariant.setting.name}}</label>
        <div class="form-fields">
            <select name="automaticBonusVariant">
                {{#select automaticBonusVariant.value}}
                    {{#each automaticBonusVariant.setting.choices as |label value|}}
                        <option value="{{value}}">{{localize label}}</option>
                    {{/each}}
                {{/select}}
            </select>
        </div>
        <p class="hint">{{localize automaticBonusVariant.setting.hint}}</p>
    </div>

    <div class="form-group">
        <label>{{localize proficiencyVariant.setting.name}}</label>
        <div class="form-fields">
            <input type="checkbox" name="proficiencyVariant" {{checked proficiencyVariant.value}} />
        </div>
        <p class="hint">{{localize "PF2E.SETTINGS.Variant.Proficiency.Hint"}}</p>
    </div>

    <div class="proficiency-modifiers">
        <div class="modifier">
            <label>{{localize "PF2E.ProficiencyLevel0"}}</label>
            <div class="form-fields">
                <input type="number" name="proficiencyUntrainedModifier" value="{{proficiencyUntrainedModifier.value}}" />
            </div>
        </div>
        <div class="modifier">
            <label>{{localize "PF2E.ProficiencyLevel1"}}</label>
            <div class="form-fields">
                <input type="number" name="proficiencyTrainedModifier" value="{{proficiencyTrainedModifier.value}}" />
            </div>
        </div>
        <div class="modifier">
            <label>{{localize "PF2E.ProficiencyLevel2"}}</label>
            <div class="form-fields">
                <input type="number" name="proficiencyExpertModifier" value="{{proficiencyExpertModifier.value}}" />
            </div>
        </div>
        <div class="modifier">
            <label>{{localize "PF2E.ProficiencyLevel3"}}</label>
            <div class="form-fields">
                <input type="number" name="proficiencyMasterModifier" value="{{proficiencyMasterModifier.value}}" />
            </div>
        </div>
        <div class="modifier">
            <label>{{localize "PF2E.ProficiencyLevel4"}}</label>
            <div class="form-fields">
                <input type="number" name="proficiencyLegendaryModifier" value="{{proficiencyLegendaryModifier.value}}" />
            </div>
        </div>
        <p class="hint">{{localize "PF2E.SETTINGS.Variant.Proficiency.ModifiersHint"}}</p>
    </div>

    <hr />

    <footer class="sheet-footer flexrow">
        <button type="submit">
            <i class="fa-regular fa-save"></i> {{localize "Save Changes"}}
        </button>
        <button type="button" name="reset">
            <i class="fa-solid fa-undo"></i> {{localize "Reset Defaults"}}
        </button>
    </footer>
</form>
