{% macro dprScoreCard(scorecard) %}
  {% set classes = scorecard.classes %}

  {% set title = scorecard.title %}
  {% set value = scorecard.value %}
  {% set rag = scorecard.rag %}
  {% set link = scorecard.link %}
  {% set trend = scorecard.trend %}
  {% set valueFor = scorecard.valueFor %}
  {% set group = scorecard.group %}

  {% set trend = scorecard.trend %}
  {% if trend.direction === 1 %}
    {% set directionIcon = '▲' %}
    {% set directionDisplay = 'Up' %}
  {% elif trend.direction === -1 %}
    {% set directionIcon = '▼' %}
    {% set directionDisplay = 'Down' %}
  {% else %}
    {% set directionIcon = '◼' %}
    {% set directionDisplay = '' %}
  {% endif %}
  <div class="dpr-scorecard" data-dpr-module="scorecard">
    <p class="govuk-heading-s govuk-!-margin-bottom-1">
      {{ title }}
    </p>

    <p class="govuk-body dpr-scorecard__value {% if rag %}govuk-tag--{{ rag.color }}{% endif %}">{{ value }}</p>
    {% if rag %}
      <p class="govuk-body dpr-scorecard__value-description">Status: {{ rag.score }}</p>
    {% endif %}

    {% if trend %}
    <p class="govuk-body-s govuk-!-margin-bottom-2">
      {{ directionIcon }} {{ directionDisplay }} {{ trend.value }} from {{ trend.from }}
    </p>
    {% endif %}

    {% if link.href %}
      <div class="govuk-!-margin-bottom-3">
        <a class="govuk-link govuk-link--no-visited-state " href="{{ link.href }}">{{ link.displayName }}<span class="govuk-visually-hidden"> for {{ title }}</span></a>
      </div>
    {% endif %}

    {% if valueFor and valueFor !== 'undefined' %}
      <p class="dpr-scorecard__value-from govuk-body-s">Value for {{ valueFor }}</p>
    {% endif %}
  </div>
{% endmacro %}
