كروت المؤشرات

<div class="flex between mb">
<h3>الهدف</h3>
<strong>78%</strong>
</div>
<div class="p-progress">
<span style="width:78%">
</span>
</div>
<p class="p-note">تتقدم على الشهر الماضي. حافظ على هذا الإيقاع.</p>

<div class="flex between">
<div>
<small>هذا الشهر</small>
<strong class="p-total" style="display:block">‏186,800 US$</strong>
</div>
<span class="trend">
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="m5 15 6-6 4 4 6-9m-7 0h7v7"/>
</svg>12.8%</span>
</div>
<div class="p-invoice-totals section-copy">
<div>
<span>الشهر الماضي</span>
<strong>‏165,603 US$</strong>
</div>
</div>

<section class="card p-goal">
<small>الرصيد المتاح</small>
<strong class="p-total" style="display:block;margin:15px 0">‏24,860 US$</strong>
<div class="flex between">
<span>•••• 2026</span>
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M20 8V5H5a3 3 0 0 0 0 6h16v8a2 2 0 0 1-2 2H5a3 3 0 0 1-3-3V8m19 3h-6v5h6m-4-2.5h1"/>
</svg>
</div>
</section>

<div class="p-stack">
<div>
<div class="flex between mb">
<span>الموقع</span>
<strong>48%</strong>
</div>
<div class="p-progress">
<span style="width:48%">
</span>
</div>
</div>
<div>
<div class="flex between mb">
<span>المتجر الإلكتروني</span>
<strong>28%</strong>
</div>
<div class="p-progress">
<span style="width:28%">
</span>
</div>
</div>
<div>
<div class="flex between mb">
<span>الشركاء</span>
<strong>16%</strong>
</div>
<div class="p-progress">
<span style="width:16%">
</span>
</div>
</div>
<div>
<div class="flex between mb">
<span>التجزئة</span>
<strong>8%</strong>
</div>
<div class="p-progress">
<span style="width:8%">
</span>
</div>
</div>
</div>