/* ═══════════════════════════════════════════════════════════════
   VinciMinds — animations.css
   @keyframes · Utility animasyon sınıfları
   Sürüm 2.0 · 16 Mart 2026
   ═══════════════════════════════════════════════════════════════ */

/* ── Fade In ── */
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Fade In Up ── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Fade In Down ── */
@keyframes fadeInDown {
  from { opacity: 0; transform: translateY(-12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Scale In ── */
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}

/* ── Slide In Left (sidebar için) ── */
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-16px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Slide In Right ── */
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(16px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Pulse Glow (logo dot, bildirim) ── */
@keyframes pulseGlow {
  0%, 100% {
    box-shadow: 0 0 6px rgba(59,130,246,0.5);
    opacity: 1;
  }
  50% {
    box-shadow: 0 0 16px rgba(59,130,246,0.9);
    opacity: 0.85;
  }
}

/* ── Shimmer (skeleton loading) ── */
@keyframes shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}

/* ── Progress Bar Fill ── */
@keyframes progressFill {
  from { width: 0%; }
  to   { width: var(--progress-target, 100%); }
}

/* ── Bounce In (rozet, badge) ── */
@keyframes bounceIn {
  0%   { transform: scale(0); opacity: 0; }
  60%  { transform: scale(1.15); opacity: 1; }
  80%  { transform: scale(0.95); }
  100% { transform: scale(1); }
}

/* ── Spin (loading spinner) ── */
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ── Theme Toggle Flip ── */
@keyframes themeFadeIn {
  from { opacity: 0; transform: scale(0.96) rotate(-2deg); }
  to   { opacity: 1; transform: scale(1) rotate(0deg); }
}

/* ── Pulse (eski compat alias) ── */
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 6px rgba(59,130,246,0.5); }
  50%       { box-shadow: 0 0 16px rgba(59,130,246,0.9); }
}

/* ── Fade In Down (eski compat alias) ── */
@keyframes fade-in-down {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Fade In Up (eski compat alias) ── */
@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Scale In (eski compat alias) ── */
@keyframes scale-in {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}

/* ══════════════════════════════════
   Utility Sınıfları
   ══════════════════════════════════ */

.animate-fade-in      { animation: fadeIn      var(--duration-normal) var(--ease-default) both; }
.animate-fade-in-up   { animation: fadeInUp    var(--duration-normal) var(--ease-default) both; }
.animate-fade-in-down { animation: fadeInDown  var(--duration-normal) var(--ease-default) both; }
.animate-scale-in     { animation: scaleIn     var(--duration-normal) var(--ease-default) both; }
.animate-slide-left   { animation: slideInLeft var(--duration-normal) var(--ease-default) both; }
.animate-slide-right  { animation: slideInRight var(--duration-normal) var(--ease-default) both; }
.animate-bounce-in    { animation: bounceIn    var(--duration-slow)   var(--ease-default) both; }
.animate-spin         { animation: spin 1s linear infinite; }
.animate-pulse-glow   { animation: pulseGlow 2.5s ease-in-out infinite; }
.animate-theme-in     { animation: themeFadeIn var(--duration-normal) var(--ease-default) both; }

/* Eski compat aliases */
.anim-fade-up   { animation: fade-in-up   var(--duration-normal) var(--ease-default) both; }
.anim-fade-down { animation: fade-in-down var(--duration-normal) var(--ease-default) both; }
.anim-scale-in  { animation: scale-in     var(--duration-normal) var(--ease-default) both; }

/* Stagger delays (liste öğeleri için) */
.stagger-1, .s1 { animation-delay: 50ms;  }
.stagger-2, .s2 { animation-delay: 100ms; }
.stagger-3, .s3 { animation-delay: 150ms; }
.stagger-4, .s4 { animation-delay: 200ms; }
.stagger-5      { animation-delay: 250ms; }
.stagger-6      { animation-delay: 300ms; }

/* Skeleton shimmer */
.skeleton {
  background: linear-gradient(
    90deg,
    var(--color-bg-card)    25%,
    var(--color-bg-elevated) 50%,
    var(--color-bg-card)    75%
  );
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--radius-md);
}