@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --bg-base: #09090b;
  --bg-surface: #0c0c10;
  --bg-elevated: #1a1a2e;
  --border-subtle: #1e1e2e;
  --border-medium: #2a2a3a;
  --border-strong: #3b3b5c;
  --text-primary: #e2e8f0;
  --text-secondary: #94a3b8;
  --text-muted: #64748b;
  --accent-purple: #a78bfa;
  --accent-indigo: #6366f1;
  --accent-violet: #7c3aed;
  --accent-emerald: #059669;
  --accent-fire: #ff6b35;
  --accent-teal: #4ecdc4;
  --health-ok: #22c55e;
  --health-warn: #eab308;
  --health-error: #ef4444;
}

html, body, #root {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

/* Toast slide-in animation */
@keyframes slide-in {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.animate-slide-in {
  animation: slide-in 0.25s ease-out;
}
