diff --git a/apps/web/src/lib/ui/data/TaskItem.svelte b/apps/web/src/lib/ui/data/TaskItem.svelte
index 76c3c68..dbf6863 100644
--- a/apps/web/src/lib/ui/data/TaskItem.svelte
+++ b/apps/web/src/lib/ui/data/TaskItem.svelte
@@ -274,16 +274,27 @@
 			>
 				↩️ Deshacer
 			</button>
-		{:else if due_date}
-			<span
-				class="date-badge"
-				class:overdue
-				class:soon={imminent}
-				title={overdue ? "Vencida" : imminent ? "Próxima" : "Fecha"}
+		{:else}
+			<button
+				class="btn primary primary-action"
+				aria-label="Completar"
+				title="Completar"
+				on:click|preventDefault={doComplete}
+				disabled={busy}
 			>
-				📅 {dateDmy}{#if overdue}
-					⚠{/if}
-			</span>
+				✅ Completar
+			</button>
+			{#if due_date}
+				<span
+					class="date-badge"
+					class:overdue
+					class:soon={imminent}
+					title={overdue ? "Vencida" : imminent ? "Próxima" : "Fecha"}
+				>
+					📅 {dateDmy}{#if overdue}
+						⚠{/if}
+				</span>
+			{/if}
 		{/if}
 	</div>
 	<div class="actions">
@@ -333,15 +344,6 @@
 					disabled={busy}>🫳 Soltar</button
 				>
 			{/if}
-			<button
-				class="btn primary primary-action"
-				aria-label="Completar"
-				title="Completar"
-				on:click|preventDefault={doComplete}
-				disabled={busy}
-			>
-				✅ Completar</button
-			>
 
 			{#if !editingText}
 				<button
@@ -513,7 +515,7 @@
 		grid-row: 3/4;
 		margin: 2px 0 4px 0;
 		display: flex;
-		flex-wrap: wrap;
+		flex-wrap: nowrap;
 		gap: 6px;
 		align-items: center;
 		justify-content: flex-start;
@@ -564,9 +566,6 @@
 		.actions {
 			justify-self: stretch;
 		}
-		.actions .primary-action {
-			flex: 1 1 100%;
-		}
 		.actions .secondary-action {
 			flex: 0 0 auto;
 		}
@@ -581,7 +580,7 @@
 		.actions {
 			grid-row: 3/4;
 			grid-column: 1/3;
-			justify-self: center;
+			justify-self: stretch;
 		}
 		.icon-btn {
 			padding: 2px;