/* =====================================================
   MOBILE.CSS - Оптимизация для мобильных устройств
   ===================================================== */

/* Отключение тяжёлых анимаций на мобильных */
@media (max-width: 768px) and (hover: none) {
  /* Отключаем частицы на мобильных */
  .particles {
    display: none;
  }

  /* Статичный градиент фона вместо анимированного */
  body {
    background: linear-gradient(-45deg, #e3f2fd, #f3e5f5);
    animation: none !important;
  }

  /* Убираем вращающееся свечение в шапке */
  .header::before {
    animation: none !important;
    display: none;
  }

  /* Упрощаем анимацию кнопки консультации */
  .consult-btn {
    animation: none !important;
    box-shadow: 0 6px 25px rgba(255, 59, 92, 0.5);
  }
  .consult-btn::before {
    animation: none !important;
    display: none;
  }
  .consult-btn::after {
    animation: none !important;
  }
  .consult-btn:hover {
    transform: translateY(-3px) scale(1.02);
  }
  .consult-btn:active {
    transform: translateY(-1px) scale(1);
  }

  /* Упрощаем hover для кнопок */
  .control-btn:hover {
    transform: translateY(-2px);
  }
  .control-btn:active {
    transform: translateY(0);
  }

  /* Упрощаем hover для карточек */
  .accordion-item:hover {
    transform: translateY(-2px);
  }
  .nested-accordion-item:hover {
    transform: translateX(3px);
  }

  /* Убираем сложные тени на мобильных */
  .accordion-item, .nested-accordion-item {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  }
  .accordion-item:hover, .nested-accordion-item:hover {
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
  }

  /* Убираем float анимацию иконок в шапке */
  h1::before, h1::after {
    animation: none !important;
  }

  /* Убираем shimmer эффект с текста DoTerra */
  h1 .doterra {
    animation: none !important;
    background: white;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  /* Убираем все fadeInUp анимации на мобильных (для быстрой загрузки) */
  .container, .header, .subtitle, .search-container, .controls,
  .accordion-item, .condition ul li, .applications p, .footer, .no-results {
    animation: none !important;
  }

  /* Полностью отключаем ripple эффект на мобильных */
  .ripple {
    animation: none !important;
    display: none !important;
  }
}

/* Отключение анимаций для пользователей с prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}