<form class="l5r5e chiaroscuro-dice-dialog" autocomplete="off">
    {{!-- Header: portrait + quick info --}}
    <div class="chi-dice-header">
        <img class="profile-img" src="{{#if actor.img}}{{actor.img}}{{else}}icons/svg/mystery-man.svg{{/if}}" alt="{{actor.name}}" />
        <div class="chi-dice-actor-info">
            <strong>{{actor.name}}</strong>
        </div>
    </div>

    {{!-- Quick Info --}}
    {{#if quickInfo}}
    <fieldset class="chi-dice-section">
        <legend>{{localize 'chiaroscuro.character.quick_info'}}</legend>
        <div class="chi-dice-quick-info">{{quickInfo}}</div>
    </fieldset>
    {{/if}}

    {{!-- Ring selector --}}
    <fieldset class="chi-dice-section">
        <legend>{{localize 'l5r5e.rings.title'}}</legend>
        <ul class="rings chi-rings">
            {{#each ringsList}}
            <li>
                <label class="attribute-label {{this.id}} centered-input ring-selection-chi pointer-choice {{#ifCond ../data.ring.id '==' this.id}}ring-selected{{/ifCond}}" data-ringid="{{this.id}}">
                    <i class="i_{{this.id}}"></i>
                    <strong>{{this.label}}</strong>
                    <span class="ring-value">{{this.value}}</span>
                </label>
            </li>
            {{/each}}
        </ul>
    </fieldset>

    {{!-- Skill info --}}
    {{#if data.skill.name}}
    <fieldset class="chi-dice-section">
        <legend>{{localize 'l5r5e.skills.title'}}</legend>
        <div class="chi-skill-row">
            <span class="chi-skill-name">{{data.skill.name}}</span>
            <span class="chi-skill-rank">{{localize (concat 'chiaroscuro.skill_ranks.' data.skill.rank)}}</span>
            {{#ifCond data.skill.bonus '>' 0}}<span class="chi-skill-bonus skill-bonus">+{{data.skill.bonus}}</span>{{/ifCond}}
        </div>
    </fieldset>
    {{/if}}

    {{!-- Difficulty + Modifier --}}
    <fieldset class="chi-dice-section">
        <legend>{{localize 'chiaroscuro.dice.difficulty_label'}}</legend>
        <div class="chi-difficulty-row">
            <select name="difficulty.id">
                {{selectOptions difficultiesList selected=data.difficulty.id valueAttr='id' labelAttr='label'}}
            </select>
            <label class="chi-modifier-label">
                {{localize 'chiaroscuro.dice.modifier_label'}}
                <input type="number" name="modifier" value="{{data.modifier}}" class="centered-input select-on-focus" style="width: 3em;" />
            </label>
        </div>
    </fieldset>

    {{!-- Aspect Point + Assistance --}}
    <fieldset class="chi-dice-section">
        <legend>{{localize 'chiaroscuro.dice.options'}}</legend>
        <div class="chi-options-row">
            <label>
                <input type="checkbox" id="use_aspect_point" {{checked data.useAspectPoint}} />
                {{localize 'chiaroscuro.dice.aspect_point'}}
                {{#if isVoidRing}}
                    <select name="aspectType">
                        {{selectOptions aspectsList selected=data.aspectType valueAttr='id' labelAttr='label'}}
                    </select>
                {{else}}
                    <em class="chi-auto-aspect">
                        {{#ifCond '["fire","earth"]' 'includes' data.ring.id}}
                            ({{localize 'chiaroscuro.aspects.solar'}})
                        {{else}}
                            ({{localize 'chiaroscuro.aspects.lunar'}})
                        {{/ifCond}}
                    </em>
                {{/if}}
            </label>
        </div>
        <div class="chi-options-row">
            <label>
                <input type="checkbox" id="use_assistance" {{checked data.useAssistance}} />
                {{localize 'chiaroscuro.dice.assistance'}}
            </label>
        </div>
    </fieldset>

    {{!-- Total dice summary --}}
    <div class="chi-dice-total-summary">
        <span>{{localize 'chiaroscuro.dice.total_dice'}} :</span>
        <strong class="chi-total-dice">{{totalDice}}d6</strong>
        {{#if data.skill.bonus}}<span> + {{data.skill.bonus}} ({{localize 'chiaroscuro.dice.bonus'}})</span>{{/if}}
        {{#if data.modifier}}<span> {{#ifCond data.modifier '>' 0}}+{{/ifCond}}{{data.modifier}} ({{localize 'chiaroscuro.dice.modifier_label'}})</span>{{/if}}
    </div>

    {{!-- Submit --}}
    <div class="chi-dice-submit">
        <button name="roll" type="submit">
            {{localize 'chiaroscuro.dice.roll'}} <i class="fas fa-dice"></i>
        </button>
    </div>
</form>
