/* Placeholder Image Styles */
.placeholder-image {
  opacity: 0.8;
  transition: opacity 0.3s ease;
}

.placeholder-image:hover {
  opacity: 1;
}

.image-loader {
  background: linear-gradient(45deg, #f0f0f0, #e0e0e0);
  animation: shimmerLoader 1.5s infinite ease-in-out;
  border-radius: 4px;
}

@keyframes shimmerLoader {
  0% {
    background-position: -200px 0;
  }
  100% {
    background-position: calc(200px + 100%) 0;
  }
}

/* Common Image Optimizations */
img {
  max-width: 100%;
  height: auto;
}

/* Loading state improvements */
.lazy-image {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.lazy-image.loaded {
  opacity: 1;
}