<main class="faction-domain-overview" aria-label="Organization domain">
    <section class="faction-domain-command">
        <div class="faction-domain-command-slot">
        {{#if domain.hasLeader}}
        <button type="button" class="faction-domain-command-card is-leader" data-faction-domain-node="{{domain.leader.nodeId}}" data-faction-domain-drop="leader" {{#if @root.isGM}}draggable="true"{{/if}} title="Open {{domain.leader.name}}">
            <span class="faction-domain-command-image nexus-entity-image is-person">
                {{#if domain.leader.imageSrc}}<img src="{{domain.leader.imageSrc}}" alt="">{{else}}<i class="fas fa-user"></i>{{/if}}
                <b class="nexus-entity-image-badge" title="Faction leader"><i class="fas fa-crown"></i></b>
            </span>
            <span class="faction-domain-command-copy">
                <em>Ruled by</em>
                <strong>{{domain.leader.name}}</strong>
                <small>{{domain.leader.subtitle}}</small>
                {{#if domain.leader.opinion}}
                <span class="faction-domain-opinion" style="--opinion-color: {{domain.leader.opinion.tierColor}}">
                    {{domain.leader.opinion.scoreLabel}} {{domain.leader.opinion.tierLabel}}
                </span>
                {{/if}}
            </span>
        </button>
        {{else}}
        <div class="faction-domain-command-card is-empty" data-faction-domain-drop="leader">
            <i class="fas fa-crown"></i><span><em>Ruler</em><strong>No faction leader appointed</strong></span>
            {{#if domain.canManage}}
            <div class="faction-domain-command-empty-actions">
                <p class="faction-domain-drop-hint faction-domain-command-drop-hint"><i class="fas fa-hand-pointer"></i> Drag a Person here to appoint an existing ruler.</p>
                <button type="button" class="faction-domain-create-leader" data-action="createFactionLeader"><i class="fas fa-user-plus"></i> Create Leader</button>
            </div>
            {{/if}}
        </div>
        {{/if}}
        </div>

        <div class="faction-domain-command-link" aria-hidden="true"><i class="fas fa-link"></i></div>

        <div class="faction-domain-command-slot">
        {{#if domain.hasSeat}}
        <button type="button" class="faction-domain-command-card is-seat" data-faction-domain-node="{{domain.seat.nodeId}}" data-faction-domain-drop="seat" {{#if @root.isGM}}draggable="true"{{/if}} title="Open {{domain.seat.name}}">
            <span class="faction-domain-command-image is-square nexus-entity-image is-place">
                {{#if domain.seat.imageSrc}}<img src="{{domain.seat.imageSrc}}" alt="">{{else}}<i class="fas fa-landmark-dome"></i>{{/if}}
                <b class="nexus-entity-image-badge" title="Seat of power"><i class="fas fa-landmark-dome"></i></b>
            </span>
            <span class="faction-domain-command-copy">
                <em>Seat of power</em>
                <strong>{{domain.seat.name}}</strong>
                <small>{{domain.seat.subtitle}}</small>
                {{#if domain.seat.ruler}}<span>Governed by {{domain.seat.ruler.name}}</span>{{/if}}
            </span>
        </button>
        {{else}}
        <div class="faction-domain-command-card is-empty" data-faction-domain-drop="seat">
            <i class="fas fa-landmark-dome"></i><span><em>Seat of power</em><strong>No seat designated</strong></span>
            {{#if domain.canManage}}<p class="faction-domain-drop-hint faction-domain-command-drop-hint"><i class="fas fa-hand-pointer"></i> Places can be dragged here to designate the faction seat.</p>{{/if}}
        </div>
        {{/if}}
        </div>
    </section>

    {{#if domain.hasIdeology}}
    <section class="faction-domain-ideology" aria-label="Organization beliefs">
        <div class="faction-ideology-grid">
            {{#each domain.ideology}}
            <article class="faction-ideology-card">
                <div class="faction-ideology-title" title="{{topicQuestion}}">
                    <span class="faction-ideology-topic"><i class="{{topicIcon}}"></i><span>{{topicLabel}}</span></span>
                    <span class="faction-ideology-separator">-</span><strong>{{tenetLabel}}</strong>
                </div>
                <p>{{tenetDescription}}</p>
            </article>
            {{/each}}
        </div>
    </section>
    {{/if}}

    <div class="faction-domain-columns">
        <section class="faction-domain-collection" data-faction-domain-drop="member">
            <h3><i class="fas fa-user-shield"></i> Members <span>{{domain.memberCount}}</span></h3>
            <div class="faction-domain-card-grid">
                {{#each domain.members}}
                <button type="button" class="faction-domain-small-card" data-faction-domain-node="{{nodeId}}" {{#if @root.isGM}}draggable="true"{{/if}} title="Open {{name}}">
                    <span class="nexus-entity-image is-person">{{#if imageSrc}}<img src="{{imageSrc}}" alt="">{{else}}<i class="fas fa-user"></i>{{/if}}</span>
                    <strong>{{name}}</strong>
                    <em>{{subtitle}}</em>
                    {{#if opinion}}<small style="--opinion-color: {{opinion.tierColor}}">{{opinion.scoreLabel}} {{opinion.tierLabel}}</small>{{/if}}
                </button>
                {{else}}
                <div class="faction-domain-empty">{{#if @root.isGM}}Drop a Person here or create a new member.{{else}}No additional members have been designated.{{/if}}</div>
                {{/each}}
            </div>
            {{#if @root.isGM}}
            <div class="faction-domain-member-footer">
                <p class="faction-domain-drop-hint">
                    <i class="fas fa-hand-pointer"></i> NPCs can be dragged here to make them faction members.
                </p>
                <button type="button" class="faction-domain-add nexus-create-button-round" data-action="createFactionMember" title="Create faction member" aria-label="Create faction member"><i class="fas fa-plus"></i></button>
            </div>
            {{/if}}
        </section>

        <section class="faction-domain-collection" data-faction-domain-drop="holding">
            <h3><i class="fas fa-chess-rook"></i> Holdings <span>{{domain.holdingCount}}</span></h3>
            <div class="faction-domain-card-grid">
                {{#each domain.holdings}}
                <button type="button" class="faction-domain-small-card is-holding" data-faction-domain-node="{{nodeId}}" {{#if @root.isGM}}draggable="true"{{/if}} title="Open {{name}}">
                    <span class="nexus-entity-image {{#if isShip}}is-object{{else}}is-place{{/if}}">{{#if imageSrc}}<img src="{{imageSrc}}" alt="">{{else}}<i class="fas {{#if isShip}}fa-rocket{{else}}fa-location-dot{{/if}}"></i>{{/if}}</span>
                    <strong>{{name}}</strong>
                    <em>{{subtitle}}</em>
                    {{#if ruler}}<small class="is-governed"><i class="fas fa-chess-king"></i> {{ruler.name}}</small>{{else if supportsLeadership}}<small class="is-vacant">No ruler appointed</small>{{/if}}
                </button>
                {{else}}
                <div class="faction-domain-empty">{{#if @root.isGM}}Drop a Place or Ship here to make it a faction holding.{{else}}This organization has no other holdings.{{/if}}</div>
                {{/each}}
            </div>
            {{#if @root.isGM}}<p class="faction-domain-drop-hint">
                <i class="fas fa-hand-pointer"></i> Places and Ships can be dragged here to make them faction holdings.
            </p>{{/if}}
        </section>
    </div>
</main>
