/* Himalaya College - loading affordances (plain CSS, not Tailwind-processed).
   Covers: (1) full-page preloader fade/fallback, (2) image skeleton shimmer. */

/* ---------- Page preloader ---------- */

#page-preloader {
  opacity: 1;
  transition: opacity 0.5s ease;
  /* Safety net: if JS never runs (script error, blocked file, etc.) this
     animation forces the preloader out of the way on its own after a delay
     comfortably longer than the expected JS-driven fade, so it never wins
     the race under normal conditions but guarantees the overlay can't get
     stuck forever. Both mechanisms converge on the same end state. */
  animation: preloader-fallback-hide 0.4s ease forwards;
  animation-delay: 2.5s;
}

#page-preloader.is-hidden {
  opacity: 0;
  pointer-events: none;
}

@keyframes preloader-fallback-hide {
  to {
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
  }
}

/* ---------- Image skeleton shimmer ---------- */

.skeleton-shimmer {
  background-color: #e5e7eb;
  background-image: linear-gradient(
    100deg,
    rgba(255, 255, 255, 0) 20%,
    rgba(255, 255, 255, 0.6) 50%,
    rgba(255, 255, 255, 0) 80%
  );
  background-size: 200% 100%;
  background-position: -50% 0;
  animation: shimmer 1.5s ease-in-out infinite;
}

@keyframes shimmer {
  0% {
    background-position: 150% 0;
  }
  100% {
    background-position: -150% 0;
  }
}