/* Pré-loader Allterra: replica a linguagem visual do pacote de referência 9090 sem dependências externas. */
html.xd-page-loading,
html.xd-page-loading body { overflow: hidden; }

.loading-overlay {
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: grid;
  color: #b9aa9b;
  background-color: rgba(81, 48, 46, .985);
  opacity: 1;
  pointer-events: all;
  place-items: center;
  transition: opacity 550ms cubic-bezier(.23, 1, .32, 1);
}

.loading-overlay[hidden] { display: none !important; }
.loading-overlay.is-hiding { opacity: 0; }

.loading-icone { display: block; width: clamp(10rem, 24vw, 18rem); height: auto; overflow: visible; }
.loading-icone-grupo { transform-box: fill-box; transform-origin: center; animation: xd-loading-exit 4.5s linear infinite; }
.loading-icone-seta,
.loading-icone-traco { fill: currentColor; transform-box: fill-box; will-change: transform, opacity; }
.loading-icone-seta { transform-origin: 52% 56%; animation: xd-loading-enter-arrow 4.5s cubic-bezier(.23, 1, .32, 1) infinite; }
.loading-icone-traco { transform-origin: 48% 52%; animation: xd-loading-enter-stroke 4.5s cubic-bezier(.23, 1, .32, 1) infinite; }

@keyframes xd-loading-enter-arrow {
  0% { opacity: 0; transform: translate(-.9rem, .9rem) scale(.84); }
  22.22%, 88.89% { opacity: 1; transform: translate(0, 0) scale(1); }
  100% { opacity: 0; transform: translate(-.4rem, .4rem) scale(.9); }
}

@keyframes xd-loading-enter-stroke {
  0% { opacity: 0; transform: translate(-1.4rem, 1.2rem) scale(.8); }
  22.22% { opacity: 0; transform: translate(-1.1rem, .9rem) scale(.84); }
  44.44%, 88.89% { opacity: 1; transform: translate(0, 0) scale(1); }
  100% { opacity: 0; transform: translate(-.5rem, .5rem) scale(.9); }
}

@keyframes xd-loading-exit {
  0%, 88.89% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(.8); }
}

@media (max-width: 767px) {
  .loading-overlay { background-color: rgba(81, 48, 46, .99); }
  .loading-icone { width: clamp(9rem, 34vw, 14rem); }
}

@media (prefers-reduced-motion: reduce) {
  .loading-icone-grupo,
  .loading-icone-seta,
  .loading-icone-traco { animation: none; opacity: 1; transform: none; }
}
