web/www/css/project.css

.project-form{
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: end;
	gap: 2rem;
}

.project-form label:has(input[type="url"]){
	grid-column: 1 / span 2
}

.project-form label:has(input[name="project-manager-user-id"]){
	grid-column-start: 1;
}

.project-form label:has(input[type="checkbox"]){
	grid-column: 1 / span 2;
}

.project-form div.footer{
	grid-column: 1 / span 2;
	text-align: right;
}

.project-form .placeholder-form{
	grid-column: 1 / span 2;
}

table.data-table .status,
table.data-table .producer{
	white-space: nowrap;
}

table.data-table{
	width: 100%;
}

table.data-table td.status{
	text-align: center;
}

table.data-table td.status.stalled{
	background: #861d1d !important; /* Override hover backgound color */
	color: #ffffff;
}

table.data-table td.status.awaiting-review{
	background: #d5b434 !important; /* Override hover backgound color */
	color: #ffffff;
}

table.data-table td.status.reviewed{
	background: #1d863c !important; /* Override hover backgound color */
	color: #ffffff;
}

@media(max-width: 750px){
	.project-form{
		grid-template-columns: 1fr;
	}

	.project-form label:has(input[type="url"]),
	.project-form label:has(input[type="checkbox"]),
	.project-form div.footer,
	.project-form .placeholder-form{
		grid-column: 1;
	}
}