{{#if missing}}
<div class="trade-good-detail-empty"><i class="fas fa-box-open"></i><strong>Trade good unavailable</strong><span>This trade good or its Location could not be resolved.</span></div>
{{else}}
<section class="trade-good-detail-shell">
    <header class="trade-good-detail-header">
        <span class="trade-good-detail-good-image">{{#if good.imageSrc}}<img src="{{good.imageSrc}}" alt="">{{else}}<i class="fas fa-box"></i>{{/if}}</span>
        <div class="trade-good-detail-title"><span>Regional Trade · {{sceneName}}</span><h2>{{good.name}}</h2><p>{{good.lotLabel}} · {{good.category}}</p></div>
        <div class="trade-good-detail-value"><strong>{{good.tradeValue}}</strong><span>gp per lot</span><em>{{statusLabel}}</em></div>
    </header>

    {{#unless hasRegion}}<p class="trade-good-detail-warning"><i class="fas fa-triangle-exclamation"></i> This Location is not placed on a regional Scene. Only goods produced here can be shown.</p>{{/unless}}
    {{#if good.description}}<p class="trade-good-detail-description">{{good.description}}</p>{{/if}}

    {{#if hasRoute}}
    <section class="trade-good-detail-route">
        <header><span>Trade Route</span><h3>{{route.heading}}</h3><p>{{route.description}}</p></header>
        <div class="trade-good-detail-route-chain">
            {{#each route.nodes}}
            {{#unless @first}}<span class="trade-good-detail-route-arrow" aria-hidden="true"><i class="fas fa-arrow-right-long"></i><small>Sends goods to</small></span>{{/unless}}
            <button type="button" class="trade-good-detail-route-node" data-action="openTradeGoodLocation" data-location-id="{{entityId}}" title="Open {{name}}">
                <span class="nexus-entity-image is-place">{{#if imageSrc}}<img src="{{imageSrc}}" alt="">{{else}}<i class="fas fa-location-dot"></i>{{/if}}</span>
                <span><strong>{{name}}</strong><small>{{roleLabel}}</small></span>
            </button>
            {{/each}}
            {{#if route.incomplete}}<span class="trade-good-detail-route-arrow is-incomplete" title="The route continues through Locations you have not discovered"><i class="fas fa-ellipsis"></i><small>Route continues</small></span>{{/if}}
        </div>
    </section>
    {{/if}}

    <div class="trade-good-detail-columns">
        <section class="trade-good-detail-list">
            <header><div><span>Producers</span><h3>Where It Is Made</h3></div><strong>{{producerCount}}</strong></header>
            <div class="trade-good-detail-rows">
                {{#each producers}}
                <button type="button" class="trade-good-detail-row" data-action="openTradeGoodLocation" data-location-id="{{entityId}}">
                    <span class="nexus-entity-image is-place">{{#if imageSrc}}<img src="{{imageSrc}}" alt="">{{else}}<i class="fas fa-location-dot"></i>{{/if}}</span>
                    <span class="trade-good-detail-location"><strong>{{name}}</strong><small>{{subtitle}}</small><em>{{tradePositionLabel}}</em></span>
                    <span class="trade-good-detail-rate">{{#if hasMarketplace}}<strong>{{sourceRatePercent}}%</strong><small>buy price</small>{{else}}<strong><i class="fas fa-route"></i></strong><small>producer</small>{{/if}}</span>
                </button>
                {{else}}<div class="trade-good-detail-empty"><i class="fas fa-industry"></i><strong>No known producers</strong><span>No visible Location produces this good in {{../sceneName}}.</span></div>{{/each}}
            </div>
        </section>

        <section class="trade-good-detail-list is-markets">
            <header><div><span>Where to Sell</span><h3>Markets Looking for This Good</h3></div><strong>{{buyerMarketCount}}</strong></header>
            <p class="trade-good-detail-help">These markets buy this good because their trade networks cannot supply it.</p>
            <div class="trade-good-detail-rows">
                {{#each buyerMarkets}}
                <button type="button" class="trade-good-detail-row" data-action="openTradeGoodLocation" data-location-id="{{entityId}}">
                    <span class="nexus-entity-image is-place">{{#if imageSrc}}<img src="{{imageSrc}}" alt="">{{else}}<i class="fas fa-city"></i>{{/if}}</span>
                    <span class="trade-good-detail-location"><strong>{{name}}</strong><small>{{subtitle}}</small><em>{{basinName}}</em></span>
                    <span class="trade-good-detail-rate is-full"><strong>{{ratePercent}}%</strong><small>sell price</small></span>
                </button>
                {{else}}<div class="trade-good-detail-empty"><i class="fas fa-scale-balanced"></i><strong>No buyer market in this region</strong><span>No known market currently buys this good.</span></div>{{/each}}
            </div>
            {{#if suppliedMarketCount}}<footer><i class="fas fa-circle-info"></i> {{suppliedMarketCount}} other market{{#unless (eq suppliedMarketCount 1)}}s already have{{else}} already has{{/unless}} access to this good.</footer>{{/if}}
        </section>
    </div>
</section>
{{/if}}
