/* ============================================================
   SiteVerse demo - _wspolne/css/ruch.css

   Klasy i keyframes ruchu oraz regula prefers-reduced-motion.

   ZASADY (z promptu rundy i z witryny SiteVerse):
   - stany poczatkowe odslaniania ustawia JS (gsap.set), w CSS nic nie
     jest ukryte: bez JS-a i bez bibliotek strona jest w calosci widoczna;
   - animujemy wylacznie transform i opacity;
   - w pierwszym ekranie nic nie zmienia pozycji (intro = sama opacity);
   - prefers-reduced-motion wylacza ruch ozdobny, ale NIE interakcje:
     suwak, kalendarz, filtr i formularz dzialaja zawsze.
   ============================================================ */

/* linia biegnaca po przycisku w stanie "Wysylam..." */
@keyframes wysylanie-linia {
  from { transform: translateX(-101%); }
  to   { transform: translateX(101%); }
}

.przycisk.jest-wysylanie { position: relative; overflow: hidden; }

.przycisk.jest-wysylanie::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: currentColor;
  animation: wysylanie-linia 0.9s linear infinite;
}

/* odpowiedz systemu wchodzi z dolu */
@keyframes odpowiedz-wejscie {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}

.odpowiedz { animation: odpowiedz-wejscie 0.55s var(--ease) both; }

/* uchwyt suwaka pulsuje, dopoki nikt go nie dotknie */
@keyframes chwyt-puls {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50%      { transform: translate(-50%, -50%) scale(1.08); }
}

.suwak__chwyt { animation: chwyt-puls 2.8s var(--ease) infinite; }
.suwak:hover .suwak__chwyt, .suwak__uchwyt:focus-visible .suwak__chwyt { animation: none; }

/* elementy wchodzace do listy po filtrze */
@keyframes wejscie-miekkie {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

.jest-nowy { animation: wejscie-miekkie 0.45s var(--ease) both; }

/* stan zmiany wartosci (np. kwota w podsumowaniu) */
@keyframes zmiana-wartosci {
  from { opacity: 0.35; }
  to   { opacity: 1; }
}

.jest-zmieniony { animation: zmiana-wartosci 0.4s var(--ease) both; }

/* ---------- reduced motion: ruch znika, interakcje zostaja ---------- */

@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;
  }
  .suwak__chwyt { animation: none; }
}
