style.css

@import url('https://fonts.googleapis.com/css2?family=Urbanist:wght@400;500;600;700;800&display=swap');

:root {
  --primary: #1e5d3f;
  --primary-dark: #15452d;
  --bg-gray: #f8f9fa;
}

body {
  font-family: 'Urbanist', sans-serif;
  -webkit-font-smoothing: antialiased;
  background-color: var(--bg-gray);
}

/* Scrollbar */
::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 10px;
}

/* Utility: line clamp (Tailwind line-clamp plugin isn't available via CDN by default) */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* Utility: fade-in used by messages */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in {
  animation: fadeIn 180ms ease-out both;
}

/* Make the “loading dots” stagger even without Tailwind animation-delay utilities */
.animate-bounce.delay-75 {
  animation-delay: 75ms;
}

.animate-bounce.delay-150 {
  animation-delay: 150ms;
}