diff --git a/components/flow.tsx b/components/flow.tsx
index 10cf1d7c..0fbacb00 100644
--- a/components/flow.tsx
+++ b/components/flow.tsx
@@ -158,30 +158,54 @@ export function Flow() {
               >
                 <div className="flex gap-3">
                   <div className="flex-shrink-0 w-14 h-14 rounded-lg bg-blue-50 flex flex-col items-center justify-center border border-blue-100">
-                    <span className="text-xs text-blue-600 font-medium uppercase">
-                      {(() => {
-                        const date = task.dateToFinish && task.dateToFinish !== '0000-00-00 00:00:00'
-                          ? new Date(task.dateToFinish)
-                          : task.editTo && task.editTo !== '0000-00-00 00:00:00'
-                            ? new Date(task.editTo)
-                            : task.editFrom && task.editFrom !== '0000-00-00 00:00:00'
-                              ? new Date(task.editFrom)
-                              : new Date(task.date);
-                        return date.toLocaleDateString('fr-FR', { month: 'short' });
-                      })()}
-                    </span>
-                    <span className="text-lg text-blue-700 font-bold">
-                      {(() => {
-                        const date = task.dateToFinish && task.dateToFinish !== '0000-00-00 00:00:00'
-                          ? new Date(task.dateToFinish)
-                          : task.editTo && task.editTo !== '0000-00-00 00:00:00'
-                            ? new Date(task.editTo)
-                            : task.editFrom && task.editFrom !== '0000-00-00 00:00:00'
-                              ? new Date(task.editFrom)
-                              : new Date(task.date);
-                        return date.getDate();
-                      })()}
-                    </span>
+                    {(() => {
+                      const getValidDate = (task: Task) => {
+                        const dates = [
+                          task.dateToFinish,
+                          task.editTo,
+                          task.editFrom,
+                          task.date
+                        ];
+                        
+                        for (const d of dates) {
+                          if (d && d !== '0000-00-00 00:00:00') {
+                            const parsed = new Date(d);
+                            if (!isNaN(parsed.getTime())) {
+                              return parsed;
+                            }
+                          }
+                        }
+                        return null;
+                      };
+
+                      const date = getValidDate(task);
+                      const today = new Date();
+                      today.setHours(0, 0, 0, 0);
+                      
+                      if (!date) {
+                        return (
+                          <>
+                            <span className="text-xs text-gray-600 font-medium">NO</span>
+                            <span className="text-lg text-gray-700 font-bold">DATE</span>
+                          </>
+                        );
+                      }
+
+                      const isPastDue = date < today;
+                      const textColorClass = isPastDue ? 'text-red-600' : 'text-blue-600';
+                      const boldColorClass = isPastDue ? 'text-red-700' : 'text-blue-700';
+
+                      return (
+                        <>
+                          <span className={`text-xs ${textColorClass} font-medium uppercase`}>
+                            {date.toLocaleDateString('fr-FR', { month: 'short' })}
+                          </span>
+                          <span className={`text-lg ${boldColorClass} font-bold`}>
+                            {date.getDate()}
+                          </span>
+                        </>
+                      );
+                    })()}
                   </div>
                   <div className="flex-1 min-w-0 space-y-1.5">
                     <a