/* ═══════════════════════════════════════════
   ICON ANIMATION SYSTEM v1.0
   Lottie-quality CSS animations for all icon libraries
   ═══════════════════════════════════════════ */

/* === BASE: All icons get subtle hover === */
.fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands, [class*="bx bx"], [class*="bx bxs"], [class*="ri-"], [class*="ph ph-"], [class*="ti ti-"], [class*="lucide"], [class*="bi bi-"] {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
              color 0.2s ease,
              filter 0.3s ease;
  vertical-align: middle;
}

/* === HOVER: Bounce scale (default for all) === */
a:hover .fas, a:hover .far, a:hover .fa-solid, a:hover .fa-regular, button:hover .fas, button:hover .far, button:hover .fa-solid, button:hover .fa-regular,
a:hover [class*="bx bx"], button:hover [class*="bx bx"],
a:hover [class*="ri-"], button:hover [class*="ri-"],
a:hover [class*="ti ti-"], button:hover [class*="ti ti-"],
a:hover [class*="bi bi-"], button:hover [class*="bi bi-"] {
  transform: scale(1.15);
}

/* === SPECIFIC HOVER ANIMATIONS === */

/* Heart icons: pulse on hover */
.fa-heart, .bx-heart, .ri-heart-line, .ph-heart, .ti-heart, .bi-heart {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), color 0.2s ease;
}
a:hover .fa-heart, button:hover .fa-heart,
.icon-btn:hover .fa-heart {
  animation: iconPulseHeart 0.6s ease;
  color: #ef4444 !important;
}

/* Bell icons: ring on hover */
a:hover .fa-bell, button:hover .fa-bell,
.icon-btn:hover .fa-bell {
  animation: iconRing 0.8s ease;
  transform-origin: top center;
}

/* Star icons: twinkle */
a:hover .fa-star, button:hover .fa-star {
  animation: iconTwinkle 0.5s ease;
  color: #f59e0b !important;
}

/* Cart icons: bounce */
a:hover .fa-shopping-cart, a:hover .fa-cart-shopping, button:hover .fa-shopping-cart, button:hover .fa-cart-shopping,
.icon-btn:hover .fa-shopping-cart, .icon-btn:hover .fa-cart-shopping {
  animation: iconBounce 0.5s ease;
}

/* Arrow icons: slide */
a:hover .fa-arrow-right, a:hover .fa-chevron-right {
  animation: iconSlideRight 0.4s ease;
}
a:hover .fa-arrow-left, a:hover .fa-chevron-left {
  animation: iconSlideLeft 0.4s ease;
}

/* Search icon: magnify */
a:hover .fa-search, a:hover .fa-magnifying-glass, button:hover .fa-search, button:hover .fa-magnifying-glass,
.icon-btn:hover .fa-search, .icon-btn:hover .fa-magnifying-glass {
  animation: iconMagnify 0.4s ease;
}

/* Shield: glow */
.fa-shield-alt, .fa-shield-halved, .fa-lock {
  transition: filter 0.3s ease, transform 0.3s ease;
}
a:hover .fa-shield-alt, a:hover .fa-shield-halved, a:hover .fa-lock {
  filter: drop-shadow(0 0 6px currentColor);
  transform: scale(1.1);
}

/* Fire: flicker */
a:hover .fa-fire, button:hover .fa-fire {
  animation: iconFlicker 0.6s ease infinite;
  color: #ef4444 !important;
}

/* Rocket: launch */
a:hover .fa-rocket, button:hover .fa-rocket {
  animation: iconLaunch 0.5s ease;
}

/* Spinner: continuous */
.fa-spinner, .fa-sync {
  animation: iconSpin 1.5s linear infinite;
}

/* Eye: blink */
a:hover .fa-eye, button:hover .fa-eye {
  animation: iconBlink 0.6s ease;
}

/* Envelope: open */
a:hover .fa-envelope, button:hover .fa-envelope {
  animation: iconEnvelopeOpen 0.5s ease;
}

/* Plus: rotate */
a:hover .fa-plus, button:hover .fa-plus {
  animation: iconRotatePlus 0.3s ease;
}

/* === KEYFRAMES === */

@keyframes iconPulseHeart {
  0% { transform: scale(1); }
  25% { transform: scale(1.3); }
  50% { transform: scale(0.95); }
  75% { transform: scale(1.15); }
  100% { transform: scale(1); }
}

@keyframes iconRing {
  0% { transform: rotate(0deg); }
  10% { transform: rotate(14deg); }
  20% { transform: rotate(-12deg); }
  30% { transform: rotate(10deg); }
  40% { transform: rotate(-8deg); }
  50% { transform: rotate(6deg); }
  60% { transform: rotate(-4deg); }
  70% { transform: rotate(2deg); }
  80% { transform: rotate(-1deg); }
  100% { transform: rotate(0deg); }
}

@keyframes iconTwinkle {
  0% { transform: scale(1) rotate(0deg); opacity: 1; }
  25% { transform: scale(1.2) rotate(-10deg); opacity: 0.8; }
  50% { transform: scale(0.9) rotate(5deg); opacity: 1; }
  75% { transform: scale(1.15) rotate(-3deg); }
  100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

@keyframes iconBounce {
  0%, 100% { transform: translateY(0); }
  30% { transform: translateY(-6px); }
  60% { transform: translateY(-3px); }
}

@keyframes iconSlideRight {
  0% { transform: translateX(0); }
  50% { transform: translateX(5px); }
  100% { transform: translateX(0); }
}

@keyframes iconSlideLeft {
  0% { transform: translateX(0); }
  50% { transform: translateX(-5px); }
  100% { transform: translateX(0); }
}

@keyframes iconMagnify {
  0% { transform: scale(1) rotate(0); }
  30% { transform: scale(1.2) rotate(-10deg); }
  60% { transform: scale(1.1) rotate(5deg); }
  100% { transform: scale(1) rotate(0); }
}

@keyframes iconFlicker {
  0%, 100% { transform: scale(1); filter: brightness(1); }
  25% { transform: scale(1.1) translateY(-1px); filter: brightness(1.3); }
  50% { transform: scale(0.98); filter: brightness(0.9); }
  75% { transform: scale(1.05) translateY(-2px); filter: brightness(1.2); }
}

@keyframes iconLaunch {
  0% { transform: translate(0, 0) rotate(-45deg); }
  50% { transform: translate(4px, -4px) rotate(-45deg) scale(1.1); }
  100% { transform: translate(0, 0) rotate(-45deg); }
}

@keyframes iconSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes iconBlink {
  0%, 100% { transform: scaleY(1); }
  50% { transform: scaleY(0.1); }
}

@keyframes iconEnvelopeOpen {
  0% { transform: scale(1) rotateX(0); }
  30% { transform: scale(1.1) rotateX(-20deg); }
  60% { transform: scale(1.05) rotateX(10deg); }
  100% { transform: scale(1) rotateX(0); }
}

@keyframes iconRotatePlus {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(90deg) scale(1.1); }
  100% { transform: rotate(90deg) scale(1); }
}

/* === SCROLL REVEAL (v3.2 transition-based — lottie !important-proof) === */
.icon-scroll-hidden {
  opacity: 0 !important;
  transform: scale(0.5) translateY(4px) !important;
  transition: opacity 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
              transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.icon-scroll-hidden.icon-revealed {
  opacity: 1 !important;
  transform: scale(1) translateY(0) !important;
}

/* === PAGE LOAD ENTRANCE STAGGER === */
@keyframes iconFadeIn {
  from { opacity: 0; transform: scale(0.5) translateY(4px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

/* Apply entrance animation to nav/header icons */
.main-nav .fas, .main-nav .far, .main-nav .fa-solid, .main-nav .fa-regular,
.icon-btn .fas, .icon-btn .far, .icon-btn .fa-solid, .icon-btn .fa-regular,
.cat-icon .fas, .cat-icon .far, .cat-icon .fa-solid, .cat-icon .fa-regular,
.stat-icon .fas, .stat-icon .far, .stat-icon .fa-solid, .stat-icon .fa-regular {
  animation: iconFadeIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) backwards;
}
.main-nav li:nth-child(1) .fas, .main-nav li:nth-child(1) .fa-solid { animation-delay: 0.05s; }
.main-nav li:nth-child(2) .fas, .main-nav li:nth-child(2) .fa-solid { animation-delay: 0.1s; }
.main-nav li:nth-child(3) .fas, .main-nav li:nth-child(3) .fa-solid { animation-delay: 0.15s; }
.main-nav li:nth-child(4) .fas, .main-nav li:nth-child(4) .fa-solid { animation-delay: 0.2s; }
.main-nav li:nth-child(5) .fas, .main-nav li:nth-child(5) .fa-solid { animation-delay: 0.25s; }
.icon-btn:nth-child(1) .fas, .icon-btn:nth-child(1) .fa-solid { animation-delay: 0.3s; }
.icon-btn:nth-child(2) .fas, .icon-btn:nth-child(2) .fa-solid { animation-delay: 0.35s; }
.icon-btn:nth-child(3) .fas, .icon-btn:nth-child(3) .fa-solid { animation-delay: 0.4s; }

/* Category cards stagger */
.cat-card:nth-child(1) .cat-icon { animation-delay: 0.1s; }
.cat-card:nth-child(2) .cat-icon { animation-delay: 0.15s; }
.cat-card:nth-child(3) .cat-icon { animation-delay: 0.2s; }
.cat-card:nth-child(4) .cat-icon { animation-delay: 0.25s; }
.cat-card:nth-child(5) .cat-icon { animation-delay: 0.3s; }
.cat-card:nth-child(6) .cat-icon { animation-delay: 0.35s; }

/* Stat icons bounce in */
.stat-card:nth-child(1) .stat-icon { animation-delay: 0.1s; }
.stat-card:nth-child(2) .stat-icon { animation-delay: 0.2s; }
.stat-card:nth-child(3) .stat-icon { animation-delay: 0.3s; }
.stat-card:nth-child(4) .stat-icon { animation-delay: 0.4s; }

/* === ANIMATED MODE (when icon_animations=on) === */
/* These only apply when the animated variant is selected */
body[data-icon-anim="true"] .fas, body[data-icon-anim="true"] .fa-solid,
body[data-icon-anim="true"] .far, body[data-icon-anim="true"] .fa-regular,
body[data-icon-anim="true"] [class*="bx bx"],
body[data-icon-anim="true"] [class*="ri-"],
body[data-icon-anim="true"] [class*="ti ti-"],
body[data-icon-anim="true"] [class*="bi bi-"] {
  /* Subtle continuous breathing */
  animation: iconBreathe 3s ease-in-out infinite;
}

@keyframes iconBreathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

/* Override breathe with specific animations on hover */
body[data-icon-anim="true"] a:hover .fas, body[data-icon-anim="true"] a:hover .fa-solid,
body[data-icon-anim="true"] button:hover .fas, body[data-icon-anim="true"] button:hover .fa-solid {
  animation: none; /* Let specific hover animations take over */
}

/* === REDUCED MOTION === */
@media (prefers-reduced-motion: reduce) {
  .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands, [class*="bx bx"], [class*="ri-"], [class*="ti ti-"], [class*="bi bi-"] {
    animation: none !important;
    transition: none !important;
  }
}

/* === MULTI-LIBRARY BASE STYLING (v4.0) === */
/* Remix Icon */
[class*="ri-"] { vertical-align: middle; line-height: 1; }
/* Phosphor */
[class*="ph ph-"] { vertical-align: middle; line-height: 1; }
/* Tabler */
[class*="ti ti-"] { vertical-align: middle; line-height: 1; font-size: inherit; }
/* Lucide */
[class*="icon-"] { vertical-align: middle; line-height: 1; }
/* Bootstrap Icons */
[class*="bi bi-"] { vertical-align: middle; line-height: 1; }
/* css.gg */
[class^="gg-"], [class*=" gg-"] { vertical-align: middle; }

/* === LORDICON STYLING === */
lord-icon, lord-icon.sp-lord-icon {
  display: inline-flex !important;
  vertical-align: middle;
  width: 1.2em;
  height: 1.2em;
}
lord-icon.lord-icon-sm, .sp-lord-icon.lord-icon-sm { width: 1em; height: 1em; }
lord-icon.lord-icon-lg, .sp-lord-icon.lord-icon-lg { width: 1.5em; height: 1.5em; }
lord-icon.lord-icon-xl, .sp-lord-icon.lord-icon-xl { width: 2em; height: 2em; }
/* Lordicon renk entegrasyonu */
lord-icon {
  --lord-icon-primary: currentColor;
  --lord-icon-secondary: currentColor;
}

/* Inherit parent color */
.lord-icon {
  --lord-icon-primary: currentColor;
  --lord-icon-secondary: currentColor;
}

/* === DARK MODE GLOW EFFECTS === */
[data-theme="dark"] a:hover .fas, [data-theme="dark"] a:hover .fa-solid,
[data-theme="dark"] button:hover .fas, [data-theme="dark"] button:hover .fa-solid,
[data-theme="dark"] .icon-btn:hover .fas, [data-theme="dark"] .icon-btn:hover .fa-solid {
  filter: drop-shadow(0 0 4px currentColor);
}