@let n = node();
@let s = summary();
@let st = stats();
@let conf = confidenceTier();
@let tagsList = visibleTagChips();
@let moreTags = moreTagsCount();

<div class="sm-gnode__main">
    <div class="sm-gnode__icon-box" aria-hidden="true">
      <sm-kind-icon [kind]="n.kind" [provider]="n.provider" [size]="18" />
    </div>

    <div class="sm-gnode__content">
      <div class="sm-gnode__name-row">
        <span class="sm-gnode__name" [pTooltip]="displayName()">{{ displayName() }}</span>
        <!-- Phase 4 / View contribution system, card.title.right slot.
             Renders `node-icon` contributions immediately after the
             title, before the actions cluster (confidence pill,
             version, chevron). -->
        <sm-view-contributions-host slot="card.title.right" [node]="node()" />
      </div>
    </div>

    <div class="sm-gnode__actions">
      <!--
        Confidence pill (LLM-derived %). Hidden behind `showLlmConfidence`
        while the LLM panel / chat owns this surface. Flip the flag in
        node-card.ts to bring it back.
      -->
      @if (showLlmConfidence && s !== null && conf !== null) {
        <span
          class="sm-gnode__confidence"
          [class.sm-gnode__llm-marker--low]="conf === 'low'"
          [class.sm-gnode__llm-marker--med]="conf === 'med'"
          [class.sm-gnode__llm-marker--high]="conf === 'high'"
          [pTooltip]="texts.confidence(s.confidence)"
        >{{ confidencePct() }}%</span>
      }
      @if (version(); as v) {
        <span class="sm-gnode__name-version" data-testid="node-card-version">{{ v }}</span>
      }
      <button
        type="button"
        class="sm-gnode__chevron"
        [attr.aria-label]="texts.ariaExpand"
        (click)="toggleExpanded($event)"
      >
        <i class="pi pi-chevron-down" aria-hidden="true"></i>
      </button>
    </div>

    <div class="sm-gnode__sub">
      @if (tokensShort() !== null) {
        <span
          class="sm-gnode__sub-stat sm-gnode__sub-stat--tokens"
          [pTooltip]="texts.stats.tokens(st.tokensTotal!)"
        ><span class="sm-gnode__sub-key">T</span>{{ tokensShort() }}</span>
      }
      @if (bytesShort() !== null) {
        <span
          class="sm-gnode__sub-stat sm-gnode__sub-stat--bytes"
          [pTooltip]="texts.stats.bytes(st.bytesTotal!)"
        ><span class="sm-gnode__sub-key">B</span>{{ bytesShort() }}</span>
      }
      @if (providerChip(); as pc) {
        <span
          class="sm-gnode__provider"
          [style.--provider-color]="pc.color"
          [style.--provider-color-dark]="pc.colorDark ?? pc.color"
          [pTooltip]="n.provider"
          data-testid="node-card-provider"
        >{{ pc.label }}</span>
      }
      <button
        type="button"
        class="sm-gnode__favorite"
        [class.sm-gnode__favorite--on]="isFavorite()"
        [attr.aria-label]="isFavorite() ? texts.ariaFavoriteRemove : texts.ariaFavoriteAdd"
        [pTooltip]="isFavorite() ? texts.favoriteRemoveTooltip : texts.favoriteAddTooltip"
        (click)="toggleFavorite($event)"
        data-testid="node-card-favorite"
      >
        <i
          class="pi"
          [class.pi-star-fill]="isFavorite()"
          [class.pi-star]="!isFavorite()"
          aria-hidden="true"
        ></i>
      </button>
      <!-- Phase 4 / View contribution system, card.subtitle.left slot.
           Sits in the sub-row immediately after the date stat. Stays in
           the natural left-to-right flow; the favorite button after it
           keeps its `margin-left: auto` push to the right edge. -->
      <sm-view-contributions-host slot="card.subtitle.left" [node]="node()" />
    </div>
  </div>

  <!-- Tag chips (top 3 + "N more" overflow). Hidden when no tags.
       Author chips (outlined) render first, user chips (filled)
       second, same attribution vocabulary as the inspector
       annotations panel. Click handling lives on the inspector
       chip, not here: card chips are read-only at this surface. -->
  @if (tagsList.length) {
    <div class="sm-gnode__tagrow" data-testid="node-card-tags">
      @for (chip of tagsList; track chip.source + ':' + chip.tag) {
        <span
          class="sm-gnode__tag-chip"
          [class.sm-gnode__tag-chip--author]="chip.source === 'author'"
          [class.sm-gnode__tag-chip--user]="chip.source === 'user'"
          [attr.data-tag-source]="chip.source"
        >{{ chip.tag }}</span>
      }
      @if (moreTags > 0) {
        <span class="sm-gnode__tag-more" data-testid="node-card-tags-more">+{{ moreTags }} more</span>
      }
    </div>
  }

  <div class="sm-gnode__panel">
    <div class="sm-gnode__path" [pTooltip]="n.path" data-testid="node-card-path">
      <i class="fa-regular fa-folder-open sm-gnode__path-icon" aria-hidden="true"></i>
      <span class="sm-gnode__path-value">{{ n.path }}</span>
    </div>

    @if (hasLlmCluster()) {
      <div class="sm-gnode__llm">
        <!--
          WHAT lines (one per kind) are hidden behind `showLlmWhat`
          while the LLM panel / chat owns this surface. Flip the flag
          in node-card.ts to bring them back without recovering the
          template structure from git history.
        -->
        @if (summaryMarkdown(); as sn) {
          @if (showLlmWhat) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.what.tooltip">{{ texts.llm.what.label }}</span>
              <span>{{ sn.whatItCovers }}</span>
            </div>
          }
          @if (sn.topics?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.topics.tooltip">{{ texts.llm.topics.label }}</span>
              <div class="sm-gnode__chips">
                @for (t of sn.topics; track t) {
                  <span class="sm-gnode__chip sm-gnode__chip--llm">{{ t }}</span>
                }
              </div>
            </div>
          }
          @if (sn.keyFacts?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.facts.tooltip">{{ texts.llm.facts.label }}</span>
              <div class="sm-gnode__chips">
                @for (f of sn.keyFacts; track f) {
                  <span class="sm-gnode__chip sm-gnode__chip--llm">{{ f }}</span>
                }
              </div>
            </div>
          }
        }
        @if (summaryAgent(); as sa) {
          @if (showLlmWhat) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.what.tooltip">{{ texts.llm.what.label }}</span>
              <span>{{ sa.whatItDoes }}</span>
            </div>
          }
          @if (sa.whenToUse) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.when.tooltip">{{ texts.llm.when.label }}</span>
              <span>{{ sa.whenToUse }}</span>
            </div>
          }
          @if (sa.interactionStyle) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.style.tooltip">{{ texts.llm.style.label }}</span>
              <span>{{ sa.interactionStyle }}</span>
            </div>
          }
          @if (sa.capabilities?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.does.tooltip">{{ texts.llm.does.label }}</span>
              <div class="sm-gnode__chips">
                @for (c of sa.capabilities; track c) {
                  <span class="sm-gnode__chip sm-gnode__chip--llm">{{ c }}</span>
                }
              </div>
            </div>
          }
        }
        @if (summarySkill(); as ss) {
          @if (showLlmWhat) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.what.tooltip">{{ texts.llm.what.label }}</span>
              <span>{{ ss.whatItDoes }}</span>
            </div>
          }
          @if (ss.recipe?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.steps.tooltip">{{ texts.llm.steps.label }}</span>
              <span>
                @for (r of ss.recipe; track r.step; let last = $last) {{{ r.step }}. {{ r.description }}{{ last ? '' : ' · ' }}}
              </span>
            </div>
          }
          @if (ss.preconditions?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.pre.tooltip">{{ texts.llm.pre.label }}</span>
              <div class="sm-gnode__chips">
                @for (p of ss.preconditions; track p) {
                  <span class="sm-gnode__chip sm-gnode__chip--llm">{{ p }}</span>
                }
              </div>
            </div>
          }
          @if (ss.outputs?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.out.tooltip">{{ texts.llm.out.label }}</span>
              <div class="sm-gnode__chips">
                @for (o of ss.outputs; track o) {
                  <span class="sm-gnode__chip sm-gnode__chip--llm">{{ o }}</span>
                }
              </div>
            </div>
          }
          @if (ss.sideEffects?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.fx.tooltip">{{ texts.llm.fx.label }}</span>
              <div class="sm-gnode__chips">
                @for (fx of ss.sideEffects; track fx) {
                  <span class="sm-gnode__chip sm-gnode__chip--llm">{{ fx }}</span>
                }
              </div>
            </div>
          }
        }
        @if (summaryCommand(); as sc) {
          @if (showLlmWhat) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.what.tooltip">{{ texts.llm.what.label }}</span>
              <span>{{ sc.whatItDoes }}</span>
            </div>
          }
          @if (sc.invocationExample) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.eg.tooltip">{{ texts.llm.eg.label }}</span>
              <code class="sm-gnode__llm-code">{{ sc.invocationExample }}</code>
            </div>
          }
          @if (sc.sideEffects?.length) {
            <div class="sm-gnode__llm-line">
              <span class="sm-gnode__llm-label" [pTooltip]="texts.llm.fx.tooltip">{{ texts.llm.fx.label }}</span>
              <div class="sm-gnode__chips">
                @for (fx of sc.sideEffects; track fx) {
                  <span class="sm-gnode__chip sm-gnode__chip--llm">{{ fx }}</span>
                }
              </div>
            </div>
          }
        }
      </div>
    }

    @if (description()) {
      <div class="sm-gnode__desc">{{ description() }}</div>
    }

    <!-- Kind-specific meta block. Only renders rows that actually have a value. -->
    @if (fmAgent(); as fa) {
      @if (fa.model) {
        <div class="sm-gnode__meta">
          <div class="sm-gnode__meta-row">
            <span class="sm-gnode__meta-label">{{ texts.meta.model }}</span>
            <span class="sm-gnode__meta-value sm-gnode__meta-value--mono">{{ fa.model }}</span>
          </div>
        </div>
      }
    }
    @if (visibleIssues().length) {
      <div class="sm-gnode__issues-block">
        @for (iss of visibleIssues(); track iss.analyzerId + iss.message) {
          <div
            class="sm-gnode__issue"
            [class.sm-gnode__issue--error]="iss.severity === 'error'"
            [class.sm-gnode__issue--warn]="iss.severity === 'warn'"
            [pTooltip]="iss.detail ?? iss.analyzerId + ' · ' + iss.message"
          >
            <i
              class="sm-gnode__issue-icon"
              [class.pi]="true"
              [class.pi-times-circle]="iss.severity === 'error'"
              [class.pi-exclamation-triangle]="iss.severity === 'warn'"
              aria-hidden="true"
            ></i>
            <code class="sm-gnode__issue-rule">{{ iss.analyzerId }}</code>
            <span class="sm-gnode__issue-msg">{{ iss.message }}</span>
          </div>
        }
      </div>
    }
  </div>

  <div class="sm-gnode__footer">
    <!--
      View contribution system, card.footer.left.* sub-slots. Renders
      counter and tag contributions on the left side of the footer,
      sibling to the stats. Each sub-slot caps independently at
      SLOT_REGISTRY['card.footer.left.<shape>'].maxItems = 5; priority
      order with alphabetical tie-break. When `node.contributions` is
      empty (cold-start, demo mode, bulk-omitted), each host renders
      nothing.
    -->
    <sm-view-contributions-host slot="card.footer.left" [node]="node()" />
    @if (errorCount() > 0) {
      <span
        class="sm-gnode__stat sm-gnode__stat--error"
        [pTooltip]="texts.stats.errors(errorCount())"
      >
        <i class="fa-solid fa-circle-xmark" aria-hidden="true"></i>
        <span class="sm-gnode__stat-num">{{ errorCount() }}</span>
      </span>
    }
    @if (warnCount() > 0) {
      <span
        class="sm-gnode__stat sm-gnode__stat--warn"
        [pTooltip]="texts.stats.warns(warnCount())"
      >
        <i class="fa-solid fa-triangle-exclamation" aria-hidden="true"></i>
        <span class="sm-gnode__stat-num">{{ warnCount() }}</span>
      </span>
    }
    <!-- View contribution system, `card.footer.right` slot. Receives
         the `stability` chips (experimental / deprecated) from the
         built-in `core/stability` extractor plus any third-party
         counters (`broken-ref`, `unknown-field`, `external-url-counter`,
         `annotation-stale`, …). The host stays silent when no
         contribution targets the slot, so the wrapper collapses to a
         zero-width inline-flex on cards without a matching chip. -->
    <div class="sm-gnode__footer-right-cluster">
      <sm-view-contributions-host slot="card.footer.right" [node]="node()" />
    </div>
  </div>