@import "tailwindcss";

@theme {
  --color-brand-50: #f0f9ff;
  --color-brand-100: #e0f2fe;
  --color-brand-500: #0ea5e9;
  --color-brand-600: #0284c7;
  --color-brand-900: #0c4a6e;

  --color-slate-850: #1e293b;
  --color-slate-900: #0f172a;
  --color-slate-950: #020617;

  --animate-pulse-glow: pulse-glow 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;

  @keyframes pulse-glow {

    0%,
    100% {
      box-shadow: 0 0 20px rgba(14, 165, 233, 0.4);
      transform: scale(1);
    }

    50% {
      box-shadow: 0 0 40px rgba(14, 165, 233, 0.8);
      transform: scale(1.03);
    }
  }
}

:root {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
}

body {
  background-color: var(--color-slate-900);
  color: #f8fafc;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #1e293b;
}

::-webkit-scrollbar-thumb {
  background: #475569;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

html {
  scroll-behavior: smooth;
}