/* Классы анимации */
.fade-in {
  animation: fadeIn 0.3s ease forwards;
}

.fade-out {
  animation: fadeOut 0.3s ease forwards;
}

.sentence-update {
  opacity: 0;
  transform: translateY(10px);
}

/* Анимация для контента табов */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

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

@keyframes slideIn {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes slideOut {
  from { transform: translateY(0); opacity: 1; }
  to { transform: translateY(100%); opacity: 0; }
}

/* Анимация переключения темной темы */
#theme-toggle .material-icons {
  transition: transform 0.5s ease;
}

.dark-mode #theme-toggle .material-icons {
  transform: rotate(180deg);
}