feat: version 2.17.6 -- Panel: "Proyectos atrasados" en porcentaje con "N de M"

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

frontend/src/pages/Dashboard/DashboardPage.jsx

@@ -17,6 +17,8 @@ export default function DashboardPage() {
   if (!data) return <div className="text-muted">{t('common_loading')}</div>;
   const { kpis, myActivities, projectsByStatus, overdueProjects } = data;
   const activeTotal = Number(kpis.activeProjects) || 0;
+  const overdueRatio = activeTotal ? Number(kpis.overdueProjects) / activeTotal : 0;
+  const overduePct = Math.round(overdueRatio * 100);
 
   return (
     <div>
@@ -26,8 +28,8 @@ export default function DashboardPage() {
         <KpiCard label={t('dashboard_active_projects')} value={kpis.activeProjects} />
         <KpiCard
           label={t('dashboard_overdue_projects')}
-          value={kpis.overdueProjects}
-          gauge={{ ratio: activeTotal ? Number(kpis.overdueProjects) / activeTotal : 0, color: 'danger' }}
+          value={`${overduePct}%`}
+          gauge={{ ratio: overdueRatio, color: 'danger', caption: `${kpis.overdueProjects} ${t('common_of')} ${activeTotal}` }}
           onClick={() => toggleDetail('overdue')}
           selected={detail === 'overdue'}
         />