/* PRELOADER */
.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh; /* Fix mobile */
  background: var(--bg-color);
  z-index: 99999;
  display: flex;
  flex-direction: column; /* Fix Chrome mobile centrage */
  align-items: center;
  justify-content: center;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

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

.preloader-text {
  color: var(--text-color);
  text-transform: uppercase;
  font-weight: normal;
  text-align: center; /* Fix Chrome mobile centrage */
  padding: 0 20px; /* Fix Chrome mobile centrage */
}

.preloader-progress {
  position: fixed;
  bottom: calc(15px + 6px);  /* navbar bottom + navbar padding */
  right: calc(15px + 10px);  /* navbar right edge + navbar-right padding */
}

/* Cacher tout le contenu sauf le preloader */
body.preloader-active > *:not(.preloader) {
  opacity: 0;
  visibility: hidden;
}

body.preloader-active {
  overflow: hidden;
}


/* Mobile */
@media (max-width: 768px) {
  .preloader-progress {
    bottom: calc(15px + 5px);  /* navbar-inner padding + navbar-left/right padding */
    right: calc(12px + 9px);   /* navbar-inner padding + navbar-right padding */
  }
}