<fieldset class="basics">
    {{#unless item.isRitual}}
        <div class="form-group">
            <label>{{localize "PF2E.SpellTraditionsLabel"}}</label>
            <input class="tags paizo-style" name="system.traits.traditions" value="{{json data.traits.traditions}}" data-dtype="JSON" />
        </div>
    {{/unless}}

    <div class="form-group">
        <label>{{localize "PF2E.Item.Spell.Cast"}}</label>
        <input type="text" name="system.time.value" value="{{data.time.value}}" />
    </div>

    <div class="form-group">
        <label>{{localize "PF2E.Item.Spell.Cost"}}</label>
        <input type="text" name="system.cost.value" value="{{data.cost.value}}" />
    </div>

    <div class="form-group">
        <label>{{localize "PF2E.SpellRequirementsLabel"}}</label>
        <input type="text" name="system.requirements" value="{{data.requirements}}" />
    </div>

    {{#if item.isRitual}}
        <div class="form-group">
            <label>{{localize "PF2E.Item.Spell.Ritual.PrimaryCheck"}}</label>
            <input type="text" name="system.ritual.primary.check" value="{{data.ritual.primary.check}}" />
        </div>

        <div class="form-group">
            <label>{{localize "PF2E.Item.Spell.Ritual.SecondaryChecks"}}</label>
            <input type="text" name="system.ritual.secondary.checks" value="{{data.ritual.secondary.checks}}" />
        </div>

        <div class="form-group">
            <label>{{localize "PF2E.Item.Spell.Ritual.SecondaryCasters"}}</label>
            <input type="number" name="system.ritual.secondary.casters" required min="0" max="100" value="{{data.ritual.secondary.casters}}" />
        </div>
    {{/if}}

    <div class="form-group">
        <label>{{localize "PF2E.SpellRangeLabel"}}</label>
        <input type="text" name="system.range.value" value="{{data.range.value}}" />
    </div>

    <div class="form-group">
        <label>{{localize "PF2E.AreaLabel"}}</label>
        <div class="details-container-two-columns">
            <select name="system.area.value" data-dtype="Number">
                <option value="0"></option>
                {{#select data.area.value}}
                    {{#each areaSizes as |label key|}}
                        <option value="{{key}}">{{localize label}}</option>
                    {{/each}}
                {{/select}}
            </select>
            <select name="system.area.type">
                <option value=""></option>
                {{#select data.area.type}}
                    {{#each areaTypes as |label type|}}
                        <option value="{{type}}">{{localize label}}</option>
                    {{/each}}
                {{/select}}
            </select>
        </div>
    </div>

    <div class="form-group">
        <label>{{localize "PF2E.SpellTargetLabel"}}</label>
        <input type="text" name="system.target.value" value="{{data.target.value}}" />
    </div>

    <div class="form-group">
        <label>{{localize "PF2E.SpellDurationLabel"}}</label>
        <input type="text" name="system.duration.value" value="{{data.duration.value}}" />
    </div>
</fieldset>

{{#unless item.isRitual}}
    <fieldset class="defense">
        <legend>{{localize "PF2E.Item.Spell.Defense.Label"}}</legend>

        {{#if passiveDefense}}
            <div class="form-group passive">
                <label>{{localize "PF2E.ActionTypePassive"}}</label>
                <div class="value">{{localize passiveDefense}}</div>
            </div>
        {{/if}}

        <div class="form-group">
            <label>{{localize "PF2E.SavingThrow"}}</label>
            <div class="form-fields">
                <select name="system.defense.save.statistic">
                    <option value=""></option>
                    {{#select data.defense.save.statistic}}
                        <option value="fortitude">{{localize "PF2E.SavesFortitude"}}</option>
                        <option value="reflex">{{localize "PF2E.SavesReflex"}}</option>
                        <option value="will">{{localize "PF2E.SavesWill"}}</option>
                    {{/select}}
                </select>
                <div class="save-basic">
                    <label
                        for="{{fieldIdPrefix}}save-basic"
                        {{#unless data.defense.save.statistic}}class="disabled"{{/unless}}
                    >{{localize "PF2E.Item.Spell.Defense.BasicSave"}}</label>
                    <input
                        type="checkbox"
                        name="system.defense.save.basic"
                        id="{{fieldIdPrefix}}save-basic"
                        {{checked data.defense.save.basic}}
                        {{disabled (not data.defense.save.statistic)}}
                    />
                </div>
            </div>
        </div>
    </fieldset>

    <fieldset>
        <legend>
            {{localize "PF2E.DamageLabel"}}
            {{#if editable}}<a data-action="add-damage-partial"><i class="fa-solid fa-fw fa-plus" ></i></a>{{/if}}
        </legend>

        <div class="damage-formulas">
            {{#each data.damage as |partial id|}}
                <div class="form-group">
                    <div class="form-fields">
                        <input type="text" name="system.damage.{{id}}.formula" value="{{partial.formula}}" placeholder="{{localize "PF2E.Formula"}}" />
                        <label class="apply-mod">
                            {{localize "PF2E.SpellAbilityModLabel"}}
                            <input type="checkbox" name="system.damage.{{id}}.applyMod" {{checked partial.applyMod}} />
                        </label>
                        <select name="system.damage.{{id}}.category">
                            {{#select partial.category}}
                                <option value=""></option>
                                {{#each @root.damageSubtypes as |name type|}}
                                    <option value="{{type}}">{{localize name}}</option>
                                {{/each}}
                            {{/select}}
                        </select>
                        <select name="system.damage.{{id}}.type">
                            {{#select partial.type}}
                                {{#each @root.damageTypes as |name type|}}
                                    <option value="{{type}}">{{localize name}}</option>
                                {{/each}}
                            {{/select}}
                        </select>
                        <select class="kinds" name="system.damage.{{id}}.kinds" data-dtype="JSON">
                            {{#each (lookup @root.damageKinds id) as |kind|}}
                                <option
                                    value={{json kind.value}}
                                    {{disabled kind.disabled}}
                                    {{#if kind.selected}}selected{{/if}}>{{localize kind.label}}</option>
                            {{/each}}
                        </select>
                        <div class="item-controls">
                            <a
                                class="tag-selector"
                                data-tag-selector="basic"
                                data-title="PF2E.Item.MaterialEffects.Label"
                                data-config-types="materialDamageEffects"
                                data-property="system.damage.{{id}}.materials"
                            ><i class="fa-solid fa-fw fa-edit"></i></a>
                            <a data-action="delete-damage-partial" data-id="{{id}}"><i class="fa-solid fa-fw fa-trash"></i></a>
                        </div>
                    </div>
                    {{#if partial.materials}}
                        <div class="materials">
                            {{#each partial.materials as |material|}}
                                <div class="tag-legacy">{{localize (lookup @root.materials material)}}</div>
                            {{/each}}
                        </div>
                    {{/if}}
                </div>
            {{/each}}
        </div>
    </fieldset>
{{/unless}}

<fieldset class="heightening">
    <legend>Heightening</legend>

    {{#if canHeighten}}
        <div class="form-group add">
            {{#if (not data.heightening)}}
                <button type="button" data-action="add-interval-heightening">
                    <i class="fa-solid fa-fw fa-plus"></i> {{localize "PF2E.SpellScalingInterval.Add"}}
                </button>
            {{/if}}
            {{#if (or (eq data.heightening.type "fixed") (not data.heightening))}}
                <button type="button"{{#if data.heightening}} class="only-option"{{/if}} data-action="add-fixed-heightening" data-overlay-type="heightening">
                    <i class="fa-solid fa-fw fa-plus"></i> {{localize "PF2E.SpellScalingOverlay.Add"}}
                </button>
            {{/if}}
        </div>
    {{/if}}

    {{#if (eq data.heightening.type "interval")}}
        <div class="form-group">
            <h3>{{localize "PF2E.SpellScalingInterval.Header"}}</h3>
            {{#if editable}}
                <div class="item-controls">
                    <a data-action="delete-heightening"><i class="fa-solid fa-fw fa-trash" data-idx="{{idx}}"></i></a>
                </div>
            {{/if}}
        </div>

        <div class="form-group">
            <label>{{localize "PF2E.SpellScalingInterval.Label"}}</label>
            <select name="system.heightening.interval" data-dtype="Number">
                {{#select data.heightening.interval}}
                    {{#each @root.heightenIntervals as |key|}}
                        <option value="{{key}}">{{localize "PF2E.SpellScalingInterval.Selection" interval=key}}</option>
                    {{/each}}
                {{/select}}
            </select>
        </div>

        {{#each data.damage as |partial idx|}}
            <div class="form-group">
                <label>{{localize (lookup @root.damageTypes partial.type)}}</label>
                <input type="text" name="system.heightening.damage.{{idx}}" value="{{lookup ../data.heightening.damage idx}}" />
            </div>
        {{/each}}
    {{/if}}

    {{!-- Spell heightening for fixed levels --}}
    {{#unless (eq data.heightening.type "interval")}}
        {{#each heightenOverlays}}
            {{> systems/pf2e/templates/items/spell-overlay.hbs this=this}}
        {{/each}}
    {{/unless}}
</fieldset>

{{#if (nor item.isRitual isVariant)}}
    <fieldset class="variants" data-can-drop="true">
        <legend class="form-group">
            {{localize "PF2E.Item.Spell.Variants.LabelPlural"}}
            <a data-action="variant-create"><i class="fa-solid fa-fw fa-plus"></i></a>
        </legend>

        {{#each variants as |variant|}}
            <div class="variant" data-variant-id="{{variant.variantId}}">
                <label>{{variant.name}}</label>
                <span class="action-glyph">{{variant.actions}}</span>
                {{#if @root.editable}}
                    <div class="item-controls">
                        <a data-action="edit-variant" data-id="{{variant.variantId}}"><i class="fa-solid fa-fw fa-edit"></i></a>
                        <a data-action="delete-variant" data-id="{{variant.variantId}}"><i class="fa-solid fa-fw fa-trash"></i></a>
                    </div>
                {{/if}}
            </div>
        {{/each}}
    </fieldset>

    <div class="form-group">
        <label class="large" for="{{fieldIdPrefix}}counteraction">{{localize "PF2E.Item.Spell.Counteract.Label"}}</label>
        <input type="checkbox" name="system.counteraction" id="{{fieldIdPrefix}}counteraction" {{checked data.counteraction}} />
    </div>
{{/if}}

{{#unless isVariant}}
    <div class="form-group">
        <label class="large" for="{{fieldIdPrefix}}toggle-ritual-data">{{localize "PF2E.Item.Spell.Ritual.Label"}}</label>
        <input type="checkbox" id="{{fieldIdPrefix}}toggle-ritual-data" data-action="toggle-ritual-data" {{checked item.isRitual}} />
    </div>
{{/unless}}
