.todogroup__input-form {
	margin-top: 80px;
	margin-left: 20px; /* ← left aligned */
	margin-right: 0; /* ← stop centering */
	max-width: 700px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	color:red
}

.todo__input-form {
	margin-top: 80px;
	margin-left: 20px; /* ← left aligned */
	margin-right: 0; /* ← stop centering */
	max-width: 700px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* one row = label + control */
.todo__row {
	display: flex;
	align-items: center;
	gap: 12px;
}

.todo__row input[type="date"] {
	flex: 0 0 160px;
}

/* fixed-width labels */
.todo__row label {
	width: 100px;
	font-weight: 600;
}

/* inputs fill remaining space */
.todo__row input,
.todo__row textarea,
.todo__row select {
	flex: 1;
	padding: 4px 6px;
	box-sizing: border-box;
}

/* description taller */
.todo__row textarea {
	min-height: 60px;
}

/* top and bottom sections if you want them */
.todo__div-top {
	margin-top: 20px;
	text-align: left;
}

.todo__div-bottom {
	margin-top: 10px;
	margin-bottom: 20px;
	display: flex;
	gap: 10px;
}

.todo__row select {
	flex: 0 0 220px;
}

/* keep your original classes (no layout hacks on labels now) */
.todo__description-label {
}

.todo__description-input {
	width: 100%;
}

.todo__description-edit {
	width: 100%;
}

.todo__title-label {
}

.todo__title-input {
	width: 100%;
}

.todo__title-edit {
	width: 100%;
}

.todo__due-date-label {
}

.todo__due-date-input {
	width: 100%;
}

.todo__due-date-edit {
	width: 100%;
}

.todo__status-input {
	width: 100%;
}