/**
 * The Meerkat — Animations
 *
 * Signal update animations, skeleton loaders, transitions.
 */

/* ── Skeleton Shimmer ────────────────────────────────────────────── */

@keyframes tm-skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ── Signal New (fade-in slide down) ─────────────────────────────── */

@keyframes tm-slide-in {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tm-signal-new {
    animation: tm-slide-in 0.3s ease-out;
}

/* ── Signal Updated (border flash) ───────────────────────────────── */

@keyframes tm-border-flash {
    0%   { border-color: var(--tm-accent); box-shadow: 0 0 0 2px rgba(196,138,16,0.15); }
    100% { border-color: var(--tm-border); box-shadow: none; }
}

.tm-signal-updated {
    animation: tm-border-flash 1.5s ease-out;
}

/* ── Corroboration Pulse (loading state) ─────────────────────────── */

@keyframes tm-corrob-pulse {
    0%, 100% { opacity: 0.4; }
    50%      { opacity: 1; }
}

.tm-corrob-pulse {
    animation: tm-corrob-pulse 1.5s ease-in-out infinite;
}

/* ── Fade In ─────────────────────────────────────────────────────── */

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

.tm-fade-in {
    animation: tm-fade-in 0.2s ease-out;
}