{# Changes area for email reports #}
{# Receives: changes (associative array of zones), strings, detail_level #}

{% for zone_key, zone in changes %}
	{% if zone.total|default(0) > 0 %}
		{# Zone sub-header #}
		<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0">
			<tr>
				<td style="padding: 10px 4px 4px; font-size: 12px; font-weight: 600; color: #555555; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;">
					{{ zone.title }}
					<span style="display: inline-block; padding: 1px 6px; font-size: 9px; font-weight: 600; background: #e7f1ff; color: #0a58ca; border-radius: 8px; margin-left: 4px; vertical-align: middle;">{{ zone.total }}</span>
				</td>
			</tr>
		</table>

		{% if detail_level == 'detailed' and zone.detailed is defined %}
			<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
				{% for item in zone.detailed %}
					<tr>
						<td style="padding: 6px 4px; font-size: 13px; color: #333333; border-bottom: 1px solid {{ loop.last ? '#d9dfd9' : '#f0f0f0' }}; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;">
							{{ item.name|raw }}
							{% if item.link is defined and item.link.href is defined %}
								&nbsp;<a href="{{ item.link.href }}" target="_blank" style="color: #008000; font-size: 12px; text-decoration: underline;">{{ item.link.text|default('View') }}</a>
							{% endif %}
						</td>
						<td style="padding: 6px 4px; font-size: 12px; color: #666666; border-bottom: 1px solid {{ loop.last ? '#d9dfd9' : '#f0f0f0' }}; text-align: right; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;">
							{% if item.rows is defined %}
								{% for row in item.rows %}
									{{ row|raw }}{% if not loop.last %}<br>{% endif %}
								{% endfor %}
							{% endif %}
						</td>
					</tr>
				{% endfor %}
			</table>
		{% endif %}
	{% endif %}
{% endfor %}
