/* Section-scoped AJAX loader — matches music equalizer animation
   (dark charcoal stage + neon green bars) */

.ajax-eq-host {
  position: relative;
}

.ajax-eq-host.is-ajax-loading {
  pointer-events: none;
  min-height: 7.5rem;
}

.ajax-eq-host.is-ajax-loading > *:not(.ajax-eq-overlay) {
  opacity: 0.22;
  transition: opacity 0.18s ease;
}

/* Always the animation’s own theme — not site light/dark */
.ajax-eq-overlay {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  padding: 1.25rem;
  background: #2c2f33;
  color-scheme: dark;
  border-radius: inherit;
  animation: ajax-eq-fade-in 0.18s ease;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.ajax-eq {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 52px;
}

.ajax-eq span {
  display: block;
  width: 8px;
  height: 100%;
  border-radius: 1px;
  background: #f28d52;
  transform: scaleY(0.22);
  transform-origin: center center;
  animation: ajax-eq-wave 0.95s ease-in-out infinite;
}

.ajax-eq span:nth-child(1) { animation-delay: 0s; }
.ajax-eq span:nth-child(2) { animation-delay: 0.11s; }
.ajax-eq span:nth-child(3) { animation-delay: 0.22s; }
.ajax-eq span:nth-child(4) { animation-delay: 0.33s; }
.ajax-eq span:nth-child(5) { animation-delay: 0.44s; }

.ajax-eq-label {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(220, 226, 232, 0.72);
}

/* Context only changes the caption — bars stay neon green on charcoal */
.ajax-eq-overlay[data-eq-context="search"] .ajax-eq-label::before { content: none; }

@keyframes ajax-eq-wave {
  0%, 100% { transform: scaleY(0.22); }
  50% { transform: scaleY(1); }
}

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

@media (prefers-reduced-motion: reduce) {
  .ajax-eq span {
    animation: none;
    transform: scaleY(0.45);
    opacity: 0.9;
  }
  .ajax-eq span:nth-child(3) {
    transform: scaleY(1);
  }
}

#ss-ajax-panel.is-loading {
  opacity: 1;
  pointer-events: none;
}