<div class="fvtt-hamalron tarot-tension-chat">
  <div class="tarot-tension-header">
    <div class="tension-info-compact">
      <img src="{{card.img}}" class="card-thumbnail" />
      <div class="card-details">
        <h3 class="card-name">{{card.name}}</h3>
        <div class="card-meta">
          <span class="meta-item">
            <i class="fas fa-shapes"></i>
            {{symboleLabel}}
          </span>
          <span class="meta-item">
            <i class="fas fa-layer-group"></i>
            {{valeurLabel}}
          </span>
          <span class="meta-item">
            <i class="fas fa-tag"></i>
            {{typeLabel}}
          </span>
        </div>
      </div>
    </div>
  </div>

  <div class="tarot-tension-body">
    <div class="difficulty-section">
      <div class="difficulty-label">
        <i class="fas fa-bolt"></i>
        {{localize "HAMALRON.Label.difficulty"}}
      </div>
      <div class="difficulty-value">{{difficulty.label}}</div>
    </div>

    <div class="calculation-section">
      <div class="calculation-row">
        <span class="calc-label">{{localize "HAMALRON.Label.cardValue"}}</span>
        <span class="calc-value">{{cardValue}}</span>
      </div>
      <div class="calculation-row">
        <span class="calc-label">{{localize "HAMALRON.Label.tensionModifier"}}</span>
        <span class="calc-value {{#if (gt tensionBonus 0)}}positive{{else if (lt tensionBonus 0)}}negative{{/if}}">
          {{#if (gt tensionBonus 0)}}+{{/if}}{{tensionBonus}}
        </span>
      </div>
      <div class="calculation-total">
        <span class="total-label">{{localize "HAMALRON.Label.totalScore"}}</span>
        <span class="total-value">{{totalScore}}</span>
      </div>
    </div>
  </div>
</div>
