/**
 * Mağaza animasyonları — Next.js template.tsx / modal davranışının PHP karşılığı.
 * app.css içindeki .animate-* sınıflarını kullanır.
 */

/* Sayfa girişi (her tam yüklemede) */
#page-content {
  animation: fade-in-up 0.35s ease-out forwards;
}

/* Buton basma geri bildirimi */
.btn-primary:active,
.btn-outline:active,
button.btn-primary:active,
button.btn-outline:active {
  transform: scale(0.97);
}

/* Modal / arama katmanı */
.modal-backdrop,
.search-backdrop {
  display: flex;
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.modal-backdrop.is-open,
.search-backdrop.is-open {
  visibility: visible;
  pointer-events: auto;
  opacity: 1;
}

.modal-panel,
.search-panel {
  transform: scale(0.96) translateY(10px);
  opacity: 0;
  transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.28s ease;
}

.modal-backdrop.is-open .modal-panel,
.search-backdrop.is-open .search-panel {
  transform: scale(1) translateY(0);
  opacity: 1;
}

/* Çerez bannerı */
#cookie-consent {
  transform: translateY(100%);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

#cookie-consent.is-visible {
  transform: translateY(0);
}

/* Sepet bildirimi */
.cart-toast-visible {
  animation: fade-in 0.2s ease-out forwards;
}

@media (prefers-reduced-motion: reduce) {
  #page-content,
  .cart-toast-visible {
    animation: none;
  }

  .modal-panel,
  .search-panel,
  #cookie-consent {
    transform: none;
    transition: none;
  }

  .modal-backdrop,
  .search-backdrop {
    transition: none;
  }

  .btn-primary:active,
  .btn-outline:active {
    transform: none;
  }
}