/**
 * DDL Step 3 - Album color picker styles
 */

.color-warning {
	background-color: #ffe0e0;
	color: #d32f2f;
	padding: 12px;
	border-radius: 4px;
	margin-bottom: 20px;
	text-align: center;
	font-weight: bold;
	animation: ddl-step3-fadeIn 0.3s ease-in-out;
}

@keyframes ddl-step3-fadeIn {
	from { opacity: 0; transform: translateY(-10px); }
	to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 768px) {
	.step3-album label.selected {
		outline: 3px solid #000;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
		position: relative;
	}

	.step3-album label.selected::after {
		content: "✓";
		position: absolute;
		top: 0.5rem;
		right: 0.5rem;
		background: #ff5500;
		color: #fff;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1rem;
		z-index: 9999;
		width: 3rem !important;
		height: 3rem !important;
	}
}