[data-bs-theme=light], [data-theme=light] {
    --kt-loading-bg: #f5f8fa;
}
[data-bs-theme=dark], [data-theme=dark] {
    --kt-loading-bg: #432977;
}
body {
  margin: 0;
  padding: 0;
}

.splash-screen {
  position: fixed;
  inset: 0;
  display: flex;
  flex-grow: 1;
  background-color: var(--kt-loading-bg);
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-family: Helvetica, 'sans-serif';
  color: #5E6278;
  font-size: 14px;
  font-weight: 400;
}

.splash-screen span {
  color: #5E6278;
  transition: none !important;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
}

.splash-screen img {
  width: 200px;
  height: auto;
  margin-bottom: 2rem;
  display: none;
}

[data-theme="dark"] .splash-screen {
  color: #92929F;
}

[data-theme="dark"] .splash-screen span {
  color: #92929F;
}
html:is([data-bs-theme=light], [data-theme="light"]) .splash-screen img.logolight {
  display: block;
}
html:is([data-bs-theme=dark], [data-theme="dark"]) .splash-screen img.logodark {
  display: block;
}
/* HTML: <div class="loaderanim"></div> */
.loaderanim {
  width: 10px;
  aspect-ratio: 1;
  border-radius: 50%;
  animation: l5 1s infinite linear alternate;
  --c-1: #000;
  --c-2: #0002
}
@keyframes l5 {
    0%  {box-shadow: 15px 0 var(--c-1), -15px 0 var(--c-2);background: var(--c-1) }
    33% {box-shadow: 15px 0 var(--c-1), -15px 0 var(--c-2);background: var(--c-2)}
    66% {box-shadow: 15px 0 var(--c-2),-15px 0 var(--c-1); background: var(--c-2)}
    100%{box-shadow: 15px 0 var(--c-2),-15px 0 var(--c-1); background: var(--c-1) }
}
html:is([data-bs-theme=dark], [data-theme="dark"]) {
  .loader {
    --c-1: #fff;
    --c-2: #fff2
  }
}