<form class="augur-region-population__form">
    {{#unless available}}
    <div class="augur-region-population__empty">
        A compatible region map and population module are required.
    </div>
    {{else}}
    <header class="augur-region-population__hero">
        <p><i class="fas fa-map-location-dot"></i> Fantasy Regional Development</p>
        <h2>{{sceneName}}</h2>
        <span>Grow faction domains, settlements, trade, roads, and personal histories across the region.</span>
    </header>

    {{#if configuring}}
        {{#if hasExistingMaterial}}
        <div class="augur-region-population__notice">
            <i class="fas fa-map-location-dot"></i>
            {{#if developedThroughYear}}
            The region has developed through Year {{developedThroughYear}}. This run continues from its current Locations, factions, people, Connections, and roads.
            {{else}}
            The map contains {{surveyCounts.locations}} Locations, {{surveyCounts.factions}} factions, and {{surveyCounts.npcs}} people. Development will begin from this existing material.
            {{/if}}
        </div>
        {{/if}}
        {{#each survey.warnings}}<p class="augur-region-population__notice"><i class="fas fa-circle-info"></i> {{this}}</p>{{/each}}
        {{#each survey.errors}}<p class="augur-region-population__error"><i class="fas fa-triangle-exclamation"></i> {{this}}</p>{{/each}}

        <fieldset class="augur-region-population__shape">
            <legend><i class="fas fa-sliders"></i> Shape the Region</legend>
            <p class="augur-region-population__shape-intro">Choose the broad character of development. Terrain and map size still determine what can be built.</p>

            <label class="augur-region-population__slider-control">
                <span class="augur-region-population__control-heading">
                    <span>Regional History</span>
                    <output data-slider-output="years">{{yearValueLabel}}</output>
                </span>
                <small>How many years of settlement, growth, and recorded history unfold.</small>
                <input type="range" name="years" min="20" max="100" step="10" value="{{settings.years}}" data-region-slider>
                <span class="augur-region-population__range-ticks is-years" data-slider-ticks="years">
                    <span data-value="20">20</span><span data-value="30">30</span><span data-value="40">40</span><span data-value="50">50</span><span data-value="60">60</span><span data-value="70">70</span><span data-value="80">80</span><span data-value="90">90</span><span data-value="100">100</span>
                </span>
            </label>

            <label class="augur-region-population__slider-control">
                <span class="augur-region-population__control-heading">
                    <span>Regional Powers</span>
                    <output data-slider-output="rootCount">{{powerValueLabel}}</output>
                </span>
                <small>How many factions begin with leaders, seats, and distinct domains. Smaller maps may become crowded.</small>
                <input type="range" name="rootCount" min="{{minimumPowerCount}}" max="6" step="1" value="{{settings.rootCount}}" data-region-slider>
                <span class="augur-region-population__range-ticks" data-slider-ticks="rootCount">
                    <span data-value="1">1</span><span data-value="2">2</span><span data-value="3">3</span><span data-value="4">4</span><span data-value="5">5</span><span data-value="6">6</span>
                </span>
            </label>

            <label class="augur-region-population__slider-control">
                <span class="augur-region-population__control-heading">
                    <span>Development</span>
                    <output data-slider-output="developmentLevel">{{developmentLabel}}</output>
                </span>
                <small>Controls growth pace, spacing, and the expansion of producing locations.</small>
                <input type="range" name="developmentLevel" min="0" max="2" step="1" value="{{developmentIndex}}" data-region-slider>
                <span class="augur-region-population__range-ticks" data-slider-ticks="developmentLevel">
                    <span data-value="0">Sparse</span><span data-value="1">Settled</span><span data-value="2">Dense</span>
                </span>
            </label>

            <label class="augur-region-population__slider-control">
                <span class="augur-region-population__control-heading">
                    <span>Trade Network</span>
                    <output data-slider-output="tradeNetworkLevel">{{tradeNetworkLabel}}</output>
                </span>
                <small>Controls roads between faction domains and the roadside services they attract.</small>
                <input type="range" name="tradeNetworkLevel" min="0" max="2" step="1" value="{{tradeNetworkIndex}}" data-region-slider>
                <span class="augur-region-population__range-ticks" data-slider-ticks="tradeNetworkLevel">
                    <span data-value="0">Isolated</span><span data-value="1">Connected</span><span data-value="2">Interwoven</span>
                </span>
            </label>

            <label class="augur-region-population__slider-control">
                <span class="augur-region-population__control-heading">
                    <span>Social Fabric</span>
                    <output data-slider-output="socialFabricLevel">{{socialFabricLabel}}</output>
                </span>
                <small>Controls acquaintances, friendships, rivalries, and personal turning points.</small>
                <input type="range" name="socialFabricLevel" min="0" max="2" step="1" value="{{socialFabricIndex}}" data-region-slider>
                <span class="augur-region-population__range-ticks" data-slider-ticks="socialFabricLevel">
                    <span data-value="0">Loose</span><span data-value="1">Familiar</span><span data-value="2">Entangled</span>
                </span>
            </label>
        </fieldset>

        {{#if powerPlan}}
        <section class="augur-region-population__powers" data-regional-power-drop>
            <header>
                <span><i class="fas fa-shield-halved"></i> Regional Powers</span>
                <nav>
                    <button type="button" data-action="createRegionalPower" {{#unless canAddRegionalPower}}disabled{{/unless}} title="Create and add a new Faction"><i class="fas fa-plus"></i> Create</button>
                    <button type="button" data-action="chooseRegionalPower" {{#unless canAddRegionalPower}}disabled{{/unless}} title="Choose an existing Faction"><i class="fas fa-list"></i> Choose</button>
                </nav>
            </header>
            <p><strong>{{powerPlan.existingCount}}</strong> on map · <strong>{{powerPlan.selectedCount}}</strong> selected · <strong>{{powerPlan.plannedCount}}</strong> generated. Drop a Nexus Faction here to include it.</p>
            <div>
                {{#each powerPlan.powers}}
                <article style="--power-color: {{color}};">
                    {{#if imageSrc}}<img src="{{imageSrc}}" alt="">{{else}}<i class="fas fa-shield-halved"></i>{{/if}}
                    <span>
                        <strong>{{name}}</strong>
                        <small>{{type}} · {{statusLabel}}</small>
                        <small class="augur-region-population__power-disposition">{{disposition}}</small>
                    </span>
                    <nav>
                        <button type="button" data-action="editRegionalPower" data-power-id="{{id}}" title="{{actionTitle}}"><i class="{{actionIcon}}"></i></button>
                        {{#if removable}}<button type="button" data-action="removeRegionalPower" data-faction-id="{{entityId}}" title="Remove {{name}} from this regional plan"><i class="fas fa-xmark"></i></button>{{/if}}
                    </nav>
                </article>
                {{/each}}
            </div>
        </section>
        {{/if}}

        <label class="augur-region-population__seed">
            <span>Generation Seed</span>
            <span>
                <input type="text" name="seed" value="{{settings.seed}}">
                <button type="button" data-action="newSeed" title="Roll a new generation seed"><i class="fas fa-rotate"></i> Roll New Seed</button>
            </span>
            <small>Kept when settings change. Roll a new seed for a different underlying variation.</small>
        </label>

        {{#if error}}<p class="augur-region-population__error">{{error}}</p>{{/if}}

        <footer>
            <button type="button" data-action="generate" class="primary" {{#if surveyBlocked}}disabled{{/if}}>
                <i class="fas fa-play"></i> {{#if developedThroughYear}}Continue Development{{else}}Begin Development{{/if}}
            </button>
            {{#if run}}
            <button type="button" data-action="clear" class="danger">
                <i class="fas fa-trash"></i> Clear Generated Additions
            </button>
            {{/if}}
        </footer>
    {{else}}
        <section class="augur-region-population__timeline-header">
            <div>
                <strong>{{progress.message}}</strong>
                <span>Year {{progress.year}} / {{progress.years}}</span>
            </div>
            <div class="augur-region-population__elapsed">
                <span><i class="fas fa-stopwatch"></i> {{#if running}}Elapsed{{else}}Final time{{/if}}</span>
                <strong data-region-elapsed>{{elapsedLabel}}</strong>
            </div>
            <div class="augur-region-population__progress">
                <div><span style="width: {{progress.pct}}%"></span></div>
            </div>
        </section>

        <section class="augur-region-population__development-counts">
            {{#each countItems}}
            <div><strong>{{value}}</strong><span>{{label}}</span></div>
            {{/each}}
        </section>

        {{#if incomplete}}
        <div class="augur-region-population__notice">
            <i class="fas fa-circle-pause"></i>
            Development stopped before completion. Its committed Locations, Connections, markers, roads, and land overlays remain valid.
        </div>
        {{/if}}
        {{#if error}}<p class="augur-region-population__error">{{error}}</p>{{/if}}

        <section class="augur-region-population__chronicle">
            <header><i class="fas fa-book-open"></i> Generation Chronicle</header>
            <ol>
                {{#each events}}
                <li>
                    <span>Year {{year}}</span>
                    <p>{{message}}</p>
                </li>
                {{else}}
                <li class="empty">The first settlements are preparing to appear...</li>
                {{/each}}
            </ol>
        </section>

        <footer>
            {{#if running}}
            <button type="button" data-action="cancel" class="danger">
                <i class="fas fa-stop"></i> Stop Development
            </button>
            {{else}}
            <button type="button" data-action="openChronicle">
                <i class="fas fa-book-open"></i> Open Chronicle
            </button>
            <button type="button" data-action="keep">
                <i class="fas fa-sliders"></i> Return to Controls
            </button>
            <button type="button" data-action="clear" class="danger">
                <i class="fas fa-trash"></i> Clear Generated Additions
            </button>
            {{/if}}
        </footer>
    {{/if}}
    {{/unless}}
</form>


