@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&family=JetBrains+Mono:wght@400;700&family=Noto+Sans+SC:wght@400;700;900&display=swap');
@import "tailwindcss";

@theme {
  --font-sans: "Space Grotesk", "Noto Sans SC", -apple-system, ssystem-ui, sans-serif;
  --font-mono: "JetBrains Mono", monospace;
}

/* Global Smooth scrolling & Custom Black-Gold scrollbars */
html {
  scroll-behavior: smooth;
  background-color: #0A0A0B;
}

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

::-webkit-scrollbar-track {
  background: #0C0C0D;
}

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

::-webkit-scrollbar-thumb:hover {
  background: #E6C280;
}

/* Custom fade effects */
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-15px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.animate-slide-up {
  animation: slideUp 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-slide-down {
  animation: slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-fade-in {
  animation: fadeIn 0.4s ease-out forwards;
}

/* No horizontal scrollbar inside tabs */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Fluid chat message box adjustments */
.dynamic-comments-box {
  scroll-behavior: smooth;
}