/* Section in animation */
html:not(.theme-editor) main .lms-section:nth-child(n+2):not(.ignore-section-animation):not(.anim-custom-child) {
  opacity: 0;
  transform: translateY(80px);
  transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}
main .section-anim-in:not(.ignore-section-animation):not(.anim-custom-child) {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
main .section-divider:nth-child(-n+2) {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* NOTE! Can't use section level animation on section containing modals or drawers */
/* Instead we animate the custom child element in the section to achieve similar animation */
html:not(.theme-editor) main .lms-section.anim-custom-child:nth-child(n+2) .custom-child-for-animation {
  opacity: 0;
  transform: translateY(80px);
  transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}
main .section-anim-in.anim-custom-child .custom-child-for-animation {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

@media (prefers-reduced-motion) {
  main .lms-section:nth-child(n+2) {
    transition: opacity 0.8s ease-in-out, opacity 0.8s ease-in-out;
  }
}