body {background-color: #f8f9fa;}

.image-card-container {
	max-width: 150px;
	margin: 0.5rem;
}

.image-card {
	transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	cursor: pointer;
	border: none; /* Remove default card border */
	text-align:center;
}

.image-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 15px rgba(0, 0, 0, 0.15) !important;
}

.image-card img {
	max-width: 120px;
	height: 120px;
	object-fit: contain;
}

#notificationBar {
	opacity: 0;
	transition: opacity 0.3s ease-in-out; /* Smooth transition on opacity */
	/* Prevents the invisible bar from blocking clicks on content behind it */
	pointer-events: none; 
	/* High z-index to ensure it sits on top of everything */
	z-index: 1050; 
}

#notificationBar.show {
	opacity: 1;
	pointer-events: auto; 
}