/* The portal previously shipped a legacy `* { font-family: 'Nexa' }` rule
   here that won the cascade against typography.css's body Inter rule (body
   itself stayed Inter, but every descendant got reset to Nexa via the
   universal selector). Removed: the design system is Inter (--cm-font-sans
   loaded by typography.css). The Nexa @font-face was orphaned with no
   actual woff2 shipped at /fonts/Nexa.woff2 — pure dead code. */

.loaderBody {
  position: absolute;
  background-image: radial-gradient(circle farthest-corner at center, white 0%, #d9d9d9 100%);
  width: 100%;
  height: 100%;
  opacity: 0.8;
  z-index: 1000000;
}

.loader {
  position: absolute;
  top: calc(50% - 105px);
  left: calc(50% - 32px);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  perspective: 800px;
  z-index: 1000000;
}

.inner {
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.inner.one {
  left: 0%;
  top: 0%;
  animation: rotate-one 1s linear infinite;
  border-bottom: 5px solid #004d4d;
}

.inner.two {
  right: 0%;
  top: 0%;
  animation: rotate-two 1s linear infinite;
  border-right: 5px solid #008080;
}

.inner.three {
  right: 0%;
  bottom: 0%;
  animation: rotate-three 1s linear infinite;
  border-top: 5px solid #00b3b3;
}

@keyframes rotate-one {
  0% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}

@keyframes rotate-two {
  0% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}

@keyframes rotate-three {
  0% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}

#errorMessageDiv {
  position: absolute;
  top: calc(50% - 100px);
  left: calc(50% - 250px);
  width: 500px;
  height: 200px;
  background-color: white;
  border-radius: 10px;
  padding: 20px;
  align-items: center;
  box-shadow: 4px 4px 4px 4px #cccccc;
  box-sizing: border-box;
  padding-bottom: 40px;
  z-index: 100000;
}

#errorMessageInnerDiv {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

.errorMessageClose {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 20pt;
  color: #cccccc;
  cursor: pointer;
}