#app-loader {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #111827, #1f2937);
}

.loader-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.loader-spinner {
  width: 64px;
  height: 64px;
  border: 4px solid #4f46e5;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

.loader-text {
  color: #d1d5db;
  font-family: system-ui, sans-serif;
  font-size: 18px;
  font-weight: 500;
}

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

@media (prefers-color-scheme: light) {
  #app-loader {
    background: linear-gradient(135deg, #eef2ff, #f5f3ff) !important;
  }

  .loader-text {
    color: #4b5563 !important;
  }
}