.loading-spinner {
  width: 28px;
  height: 28px;
  border: 2.5px solid rgba(42, 107, 85, 0.16);
  border-top-color: var(--green, #2a6b55);
  border-radius: 50%;
  animation: loading-spin 0.72s linear infinite;
}

.loading-spinner.is-small {
  width: 18px;
  height: 18px;
  border-width: 2px;
}

.loading-label {
  margin: 0;
  color: var(--muted, #6f675c);
  font-size: 0.92rem;
  line-height: 1.45;
}

.data-loading {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 12px;
  min-height: 140px;
  padding: 36px 22px;
  text-align: center;
}

.data-loading.is-compact {
  min-height: 88px;
  padding: 24px 16px;
  gap: 10px;
}

.is-loading-region {
  min-height: 120px;
}

.site-boot-loader {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: none;
  place-items: center;
  gap: 14px;
  background: linear-gradient(180deg, #f8f4ec 0%, #f3eee4 100%);
}

body.auth-checking .site-boot-loader {
  display: grid;
}

.panel-loading-overlay {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-items: center;
  gap: 12px;
  border-radius: inherit;
  background: rgba(255, 253, 248, 0.82);
  backdrop-filter: blur(2px);
}

.panel-loading-host {
  position: relative;
}

.panel-loading-host.is-panel-loading > :not(.panel-loading-overlay) {
  opacity: 0.45;
  pointer-events: none;
}

.auth-loading {
  display: grid;
  justify-items: center;
  padding: 10px 0 4px;
}

.auth-loading[hidden] {
  display: none !important;
}

@keyframes loading-spin {
  to {
    transform: rotate(360deg);
  }
}