/* css/styles.css — Custom styling and overrides */

/* --- Animate-in utility classes (mirrors tailwindcss-animate) --- */
.animate-in {
  animation-fill-mode: both;
}

.animate-in.fade-in {
  animation-name: fade-in;
  animation-duration: 150ms;
  animation-timing-function: ease-out;
}

.animate-in.zoom-in-95 {
  animation-name: zoom-in-95;
  animation-duration: 200ms;
  animation-timing-function: ease-out;
}

/* Override animation duration when combined with duration utilities */
.animate-in.fade-in.duration-200 {
  animation-duration: 200ms;
}

.animate-in.fade-in.duration-300,
.animate-in.zoom-in-95.duration-300 {
  animation-duration: 300ms;
}

@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes zoom-in-95 {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}

/* --- Smooth scroll behaviour --- */
html {
  scroll-behavior: smooth;
}

/* --- Selection colour --- */
::selection {
  background-color: #fee2e2;
  color: #7f1d1d;
}