<div class="text-center">
    <p class="text-sm text-gray-600 dark:text-gray-400 mb-2">Revenue</p>
    <canvas id="sparkline1" height="40"></canvas>
    <p class="text-2xl font-bold text-gray-900 dark:text-white mt-2">$45,231</p>
</div>

<script>
new Chart(document.getElementById('sparkline1').getContext('2d'), {
    type: 'line',
    data: { labels: Array(12).fill(''), datasets: [{ data: [20,25,22,30,28,35,32,40,38,45,42,48], borderColor: 'rgb(16,185,129)', borderWidth: 2, fill: false, tension: 0.4 }] },
    options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false } }, scales: { x: { display: false }, y: { display: false } } }
});
</script>