body {
  margin: 0;
}

html {
  overflow: hidden scroll;
}

#loading-bg {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--initial-loader-bg, #fff);
  block-size: 100%;
  gap: 1rem 0;
  inline-size: 100%;
}

html[data-brand="vinco"] .loading-logo {
  display: grid;
  place-items: center;
  block-size: 84px;
  inline-size: 84px;
}

html[data-brand="vinco"] .loading-logo > svg {
  display: none;
}

html[data-brand="vinco"] .loading-logo::before {
  display: block;
  inline-size: 84px;
  block-size: 84px;
  background: url("/brand/vinco-mark.svg") center / contain no-repeat;
  content: "";
}

html[data-brand="vinco"][data-loader-theme="dark"] .loading-logo::before {
  background-image: url("/brand/vinco-mark-light.svg");
}

html[data-brand="crm"] .loading-logo {
  display: grid;
  place-items: center;
  block-size: 84px;
  inline-size: 236px;
}

html[data-brand="crm"] .loading-logo > svg:not(.crm-loading-wordmark) {
  display: none;
}

html[data-brand="crm"] .crm-loading-wordmark {
  display: block;
  block-size: 84px;
  inline-size: 236px;
  background: url("/brand/crm-wordmark.svg?v=20260923-4") center / contain no-repeat;
}

html[data-brand="crm"][data-loader-theme="dark"] .crm-loading-wordmark {
  background-image: url("/brand/crm-wordmark-light.svg?v=20260923-4");
}

html[data-brand="mitgliid"] .loading-logo {
  display: grid;
  place-items: center;
  block-size: 84px;
  inline-size: 236px;
}

html[data-brand="mitgliid"] .loading-logo > svg {
  display: none;
}

html[data-brand="mitgliid"] .loading-logo::before {
  display: block;
  inline-size: 236px;
  block-size: 64px;
  background: var(--mitgliid-loader-logo, url("/brand/mitgliid-wordmark.svg")) center / contain no-repeat;
  content: "";
}

html[data-brand="mitgliid"][data-loader-theme="dark"] .loading-logo::before {
  background-image: var(--mitgliid-loader-logo, url("/brand/mitgliid-wordmark-light.svg"));
}

html:not([data-brand="crm"]) .crm-loading-wordmark {
  display: none;
}

.loading {
  box-sizing: border-box;
  border: 3px solid color-mix(in srgb, var(--initial-loader-color, #0074ec) 18%, transparent);
  border-block-start-color: var(--initial-loader-color, #0074ec);
  border-radius: 50%;
  animation: loader-spin 0.8s linear infinite;
  block-size: 40px;
  inline-size: 40px;
}

.loading .effects {
  display: none;
}

@keyframes loader-spin {
  to {
    transform: rotate(1turn);
  }
}

@media (prefers-reduced-motion: reduce) {
  .loading {
    animation-duration: 2.4s;
  }
}

html:not([data-brand]) .loading-logo {
  display: grid;
  place-items: center;
  block-size: 84px;
  inline-size: 84px;
}

html:not([data-brand]) .loading-logo > svg {
  display: none;
}

html:not([data-brand]) .loading-logo::before {
  display: block;
  inline-size: 84px;
  block-size: 84px;
  background: url("/brand/ionio-symbol-glass-blue.png") center / contain no-repeat;
  content: "";
}

/* Dark loader: the white glass symbol. */
html:not([data-brand])[data-loader-theme="dark"] .loading-logo::before {
  background-image: url("/brand/ionio-symbol-glass-white.png");
}
