// Renders the price-history line chart on the per-item results page.
// Chart data is read from the canvas's data-chart attribute: templ
// interpolates attribute values but treats <script> element contents as raw
// text, so the JSON cannot live in an inline <script> block. Loaded after
// chart.umd.min.js with the #price-chart canvas already in the DOM above it.
(function () {
	var canvas = document.getElementById('price-chart');
	if (!canvas || !canvas.dataset.chart || typeof Chart === 'undefined') {
		return;
	}
	var data = JSON.parse(canvas.dataset.chart);
	new Chart(canvas.getContext('2d'), {
		type: 'line',
		data: {
			labels: data.labels,
			datasets: [{
				label: 'Best price',
				data: data.points,
				borderColor: '#00e4a4',
				backgroundColor: 'rgba(0,228,164,0.15)',
				pointBackgroundColor: '#e84040',
				pointRadius: 3,
				tension: 0.25,
				fill: true
			}]
		},
		options: {
			scales: {
				x: { ticks: { color: '#a8c0f0' }, grid: { color: 'rgba(255,255,255,0.07)' } },
				y: { ticks: { color: '#a8c0f0' }, grid: { color: 'rgba(255,255,255,0.07)' } }
			},
			plugins: { legend: { labels: { color: '#ffffff' } } }
		}
	});
})();