/* ==========================================================================
   Анимации модалок и шторок (Radix Dialog).

   ЗАЧЕМ ЭТОТ ФАЙЛ
   Основной CSS («Селюк VPN») — JIT-сборка (purged stylesheet):
   Tailwind вырезал классы, которые не встречались в исходниках на момент
   сборки. В частности, из разметки Radix-компонентов выпали
   `data-[state=open]:animate-in`, `fade-in-0`, `zoom-in-95` — поэтому все
   модалки и шторки открывались МГНОВЕННО (без fade, без зума, без сдвига).

   Здесь keyframes и селекторы по `data-slot` и классам — они не зависят от
   того, какие классы Tailwind успел вырезать. Файл подключается ПОСЛЕ
   основного CSS, его правила имеют высший приоритет.

   Стиль — как в iOS/Telegram: шторка плавно выезжает снизу с физической
   инерцией, диалоги по центру мягко масштабируются, подложка плавно затемняется.
   ========================================================================== */

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

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

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

@keyframes selyk-zoom-out {
  from { opacity: 1; transform: scale(1); }
  to   { opacity: 0; transform: scale(0.97); }
}

@keyframes selyk-slide-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

@keyframes selyk-slide-down {
  from { transform: translateY(0); }
  to   { transform: translateY(100%); }
}

/* Алиасы для классов из базового CSS (предотвращают выпадение в 0ms) */
@keyframes bottom-sheet-dialog-enter {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

@keyframes bottom-sheet-dialog-exit {
  from { transform: translateY(0); }
  to   { transform: translateY(100%); }
}

/* ── Подложка ───────────────────────────────────────────────────────────── */
[data-slot="dialog-overlay"],
[data-slot="dialog-overlay"][data-state="closed"] {
  animation: selyk-fade-out 200ms cubic-bezier(0.4, 0, 1, 1) both !important;
}

[data-slot="dialog-overlay"][data-state="open"] {
  animation: selyk-fade-in 260ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

/* ── Диалог по центру (не шторка) ──────────────────────────────────────── */
[data-slot="dialog-content"]:not(.bottom-sheet-dialog-content),
[data-slot="dialog-content"]:not(.bottom-sheet-dialog-content)[data-state="closed"] {
  animation: selyk-zoom-out 180ms cubic-bezier(0.4, 0, 1, 1) both !important;
  transition: none !important;
}

[data-slot="dialog-content"]:not(.bottom-sheet-dialog-content)[data-state="open"] {
  animation: selyk-zoom-in 240ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
  transition: none !important;
}

/* ── Шторка снизу (bottom sheet: рефералы, тарифы, слоты) ─────────────── */
[data-slot="dialog-content"].bottom-sheet-dialog-content,
[data-slot="dialog-content"].bottom-sheet-dialog-content[data-state="closed"],
.bottom-sheet-dialog-content[data-state="closed"] {
  animation: selyk-slide-down 240ms cubic-bezier(0.32, 0, 0.67, 0) both !important;
  transition: none !important;
  will-change: transform;
}

[data-slot="dialog-content"].bottom-sheet-dialog-content[data-state="open"],
.bottom-sheet-dialog-content[data-state="open"] {
  animation: selyk-slide-up 320ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
  transition: none !important;
  will-change: transform;
}

/* ── Фоновые частицы Selyuk: аппаратное ускорение и умная пауза ─────────── */
[style*="promo-float"] {
  will-change: transform, opacity;
  contain: strict;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* При открытых модальных окнах фоновые частицы автоматически замирают */
body:has([role="dialog"]) [style*="promo-float"],
body:has([data-state="open"]) [style*="promo-float"],
body:has(.bottom-sheet-dialog-content) [style*="promo-float"] {
  animation-play-state: paused !important;
}

/* ── Доступность: пользователь просил меньше движения ─────────────────── */
@media (prefers-reduced-motion: reduce) {
  [data-slot="dialog-overlay"],
  [data-slot="dialog-content"],
  .bottom-sheet-dialog-content {
    animation-duration: 1ms !important;
  }

  /* Отключение фоновых плавающих частиц и циклических анимаций для экономии батареи и доступности */
  [style*="promo-float"],
  [style*="orb-breathe"],
  [style*="banner-pulse"],
  .animate-pulse-ring,
  .animate-spin,
  .animate-fade-up,
  .animate-scale-bounce {
    animation: none !important;
    transition: none !important;
  }
}
