@charset "UTF-8";

.overlay-container { 
	display: none; 
	position: fixed; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%; 
	background: rgba(0, 0, 0, 0.6); 
	justify-content: center; 
	align-items: center; 
	opacity: 0; 
	transition: opacity 0.3s ease; 
	position: fixed;
	z-index: 2000;
} 

.popup-box { 
	background: #fff; 
	padding: 24px; 
	border-radius: 12px; 
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); 
	width: 70%; 
	text-align: center; 
	opacity: 0; 
	transform: scale(0.8); 
	animation: fadeInUp 0.5s ease-out forwards; 
} 

.btn-close-popup { 
	padding: 12px 24px; 
	border: none; 
	border-radius: 8px; 
	cursor: pointer; 
	transition: background-color 0.3s ease, color 0.3s ease; 
} 
.btn-close-popup { 
	margin-top: 12px; 
	background-color: #e74c3c; 
	color: #fff; 
} 


/* Keyframes for fadeInUp animation */ 
@keyframes fadeInUp { 
	from { 
		opacity: 0; 
		transform: translateY(20px); 
	} 

	to { 
		opacity: 1; 
		transform: translateY(0); 
	} 
} 

/* Animation for popup */ 
.overlay-container.show { 
	display: flex; 
	opacity: 1; 
}