/* ============================================================
   PRELOADER.CSS
   Full-screen loader shown while a page is loading. Hidden
   automatically by assets/js/preloader.js once the page is ready.
   ============================================================ */

#preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--color-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
#preloader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.preloader-mark {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
}
.preloader-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid var(--color-border);
  border-top-color: var(--color-brand);
  border-radius: 50%;
  animation: preloader-spin 0.7s linear infinite;
}
.preloader-mark span {
  font-size: var(--fs-sm);
  color: var(--color-text-muted);
}
@keyframes preloader-spin {
  to { transform: rotate(360deg); }
}