/**
 * ArgenTous — Animations (07-animations.css)
 *
 * Animation classes:
 *  .Agtcla-fade-in    — opacity 0 → 1 in 300ms
 *  .Agtcla-slide-up   — translateY 20px → 0 in 300ms
 *  .Agtcla-pulse      — balance card pulse on load
 *  .Agtcla-skeleton   — skeleton placeholder shimmer
 *
 * All animations respect prefers-reduced-motion.
 *
 * @package ArgenTous
 * @version 3.0.0
 */

/* ── Keyframes ───────────────────────────────────────────────────────────── */

@keyframes Agtcla-fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes Agtcla-slideUp {
  from {
    opacity:   0;
    transform: translateY(20px);
  }
  to {
    opacity:   1;
    transform: translateY(0);
  }
}

@keyframes Agtcla-pulse {
  0%   { transform: scale(1);    box-shadow: 0 0 0 0 rgba(79, 70, 229, .4); }
  50%  { transform: scale(1.01); box-shadow: 0 0 0 12px rgba(79, 70, 229, 0); }
  100% { transform: scale(1);    box-shadow: 0 0 0 0 rgba(79, 70, 229, 0); }
}

@keyframes Agtcla-skeletonWave {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}

@keyframes Agtcla-spin {
  to { transform: rotate(360deg); }
}

@keyframes Agtcla-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: .4; }
}

/* ── Utility classes ─────────────────────────────────────────────────────── */

/**
 * .Agtcla-fade-in
 * Fade from invisible to visible.
 * Stagger using animation-delay on siblings.
 */
.Agtcla-fade-in {
  animation: Agtcla-fadeIn 300ms ease both;
}

/**
 * .Agtcla-slide-up
 * Slide upward from 20px below with fade-in.
 * Combine with inline style="animation-delay: NNms" for staggering.
 */
.Agtcla-slide-up {
  animation: Agtcla-slideUp 350ms cubic-bezier(.25, .46, .45, .94) both;
}

/**
 * .Agtcla-pulse
 * One-shot pulse ring on load — used on the balance card.
 * Plays once, 1 second after load.
 */
.Agtcla-pulse {
  animation: Agtcla-pulse 1.2s ease-out 1s 1;
}

/**
 * .Agtcla-skeleton
 * Animated shimmer placeholder for loading states.
 * Apply to any container while async data is loading.
 */
.Agtcla-skeleton {
  background: linear-gradient(
    90deg,
    var(--agt-gray-100, #f3f4f6) 25%,
    var(--agt-gray-200, #e5e7eb) 50%,
    var(--agt-gray-100, #f3f4f6) 75%
  );
  background-size: 400px 100%;
  animation: Agtcla-skeletonWave 1.4s ease infinite;
  border-radius: var(--agt-radius-sm, 6px);
  min-height: 80px;
  /* Prevent content from rendering during loading */
  color: transparent;
  pointer-events: none;
  user-select: none;
}

/* Skeleton variants */
.Agtcla-skeleton--sm   { min-height: 40px; }
.Agtcla-skeleton--lg   { min-height: 160px; }
.Agtcla-skeleton--full { min-height: 320px; }

/**
 * Skeleton line rows — simulates text content
 */
.agt-skeleton-lines {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
}

.agt-skeleton-lines::before,
.agt-skeleton-lines::after {
  content: '';
  display: block;
  height: 14px;
  background: inherit;
  border-radius: 4px;
}

.agt-skeleton-lines::before { width: 75%; }
.agt-skeleton-lines::after  { width: 50%; }

/**
 * .Agtcla-spin
 * Continuous rotation — used for loading spinners.
 */
.Agtcla-spin {
  animation: Agtcla-spin 0.7s linear infinite;
  display: inline-block;
}

/**
 * .Agtcla-blink
 * Blinking indicator — used for live/realtime status dots.
 */
.Agtcla-blink {
  animation: Agtcla-blink 1.5s ease-in-out infinite;
}

/* ── Transition utilities ─────────────────────────────────────────────────── */

.agt-transition-all    { transition: all     150ms ease; }
.agt-transition-colors { transition: color, background-color, border-color 150ms ease; }
.agt-transition-shadow { transition: box-shadow 150ms ease; }
.agt-transition-transform { transition: transform 150ms ease; }

/* ── Dashboard-specific micro-interactions ────────────────────────────────── */

/* Stat cards stagger on initial render */
.agt-stats-grid .agt-stat-card:nth-child(1) { animation-delay:   0ms; }
.agt-stats-grid .agt-stat-card:nth-child(2) { animation-delay:  80ms; }
.agt-stats-grid .agt-stat-card:nth-child(3) { animation-delay: 160ms; }
.agt-stats-grid .agt-stat-card:nth-child(4) { animation-delay: 240ms; }

/* Table rows fade in on AJAX update */
.agt-table tbody tr {
  animation: Agtcla-fadeIn 200ms ease both;
}

/* Agent list item stagger */
.agt-agents-list .agt-agent-item {
  animation: Agtcla-slideUp 280ms cubic-bezier(.25, .46, .45, .94) both;
}

/* Section chevron transition */
.agt-section__chevron {
  transition: transform 200ms cubic-bezier(.4, 0, .2, 1);
}

/* Balance figure number "count-up" feel — purely visual CSS */
.agt-balance-card__figure {
  display: inline-block;
  animation: Agtcla-slideUp 400ms cubic-bezier(.25, .46, .45, .94) both;
}

/* ── Reduced-motion: disable all animations ───────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration:        0.01ms !important;
    animation-iteration-count: 1      !important;
    transition-duration:       0.01ms !important;
  }
}