body {
	
}

.matrix {
	min-height: 420px;
}

.matrix .cell {
	border: 1px solid #ddd;
	padding: 0px 10px;
	overflow-y: auto;
	min-height: 200px;
}

.task-item {
	margin-bottom: 8px;
	padding: 8px;
	border-radius: 6px;
	background: #f8f9fa;
	cursor: grab;
}

.task-item.done {
	text-decoration: line-through;
	opacity: .6;
}

.badge-priority {
	font-size: 0.7rem;
}

.cell {
	min-height: 25vh !important;
	max-height: 40vh !important;
}
.cell-title {
	font-weight: 600;
	margin-bottom: 6px;
}

.drag-over {
	background: #e3f2fd;
	border: 2px dashed #90caf9;
}

.rotator::before {
	content: "";
	position: absolute;
	top: -1rem;
	/* nhô lên trên div */
	left: 50%;
	transform: translateX(-50%);
	border-left: 1rem solid transparent;
	border-right: 1rem solid transparent;
	border-bottom: 2rem solid #dc3545;
	/* màu mũi tên */
}

.rotator-line::after {
	content: "";
	position: absolute;
	right: -2rem;
	/* nhô lên trên div */
	top: 50%;
	transform: translateY(-50%);
	border-top: 1rem solid transparent;
	border-bottom: 1rem solid transparent;
	border-left: 2rem solid #dc3545;
	/* màu mũi tên */
}

.rotator-line::before {
	content: "";
	position: absolute;
	left: -0.5rem;
	/* nhô lên trên div */
	top: 50%;
	transform: translateY(-50%);
	border: 1rem solid;
	border-radius: 50%;
}

footer { background: #f1f1f1; padding: 20px; text-align: center; font-size: 0.9rem; }