{% import "tungsten/components/ui.html" as ui %}
{% set cols = {2: 'sm:grid-cols-2', 3: 'sm:grid-cols-2 lg:grid-cols-3', 4: 'sm:grid-cols-2 xl:grid-cols-4', 5: 'sm:grid-cols-2 xl:grid-cols-5', 6: 'sm:grid-cols-3 xl:grid-cols-6'} %}
<div class="grid grid-cols-1 gap-6 {{ cols.get(w.columns, cols[4]) }}">
  {% for s in stats %}
  {{ ui.stat_card(__(s.label), s.value, s.icon_name, s.color_name, __(s.description) if s.description else s.description, s.trend_value, s.trend_direction, s.trend_color, s.chart_points, s.url_value, 'spark-' ~ w.get_id() ~ '-' ~ loop.index) }}
  {% endfor %}
</div>