/* =====================================================
   SUSTT CORE – ANIMATIONS
   Animations limitées (shimmer, transitions)
   ===================================================== */

/* ================================
   Skeleton Table Classements
================================ */

.sustt-skeleton tbody tr td {
    padding: 12px 8px;
}

/* Skeleton rows pronos */
.sustt-skeleton-row td {
    padding: 14px 10px;
}

.sustt-skeleton-row .sk {
    display: block;
}

.sk-rank {
    width: 20px;
}

.sk-team {
    width: 120px;
}

.sk-small {
    width: 30px;
}

/* ================================
   SLIDE TRANSITION
================================ */

.sustt-slide-layer {
    transition:
        transform 180ms ease,
        opacity 180ms ease;
}

.sustt-slide-out-left {
    transform: translateX(-120px);
    opacity: 0;
}

.sustt-slide-out-right {
    transform: translateX(120px);
    opacity: 0;
}

.sustt-slide-in-right {
    transform: translateX(120px);
    opacity: 0;
}

.sustt-slide-in-left {
    transform: translateX(-120px);
    opacity: 0;
}

/* ===============================
    SKELETON UX
================================ */

.sustt-card-skeleton {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
    animation: susttCardReveal 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;

    box-shadow:
        0 6px 14px var(--sustt-shadow-soft-strong),
        0 0 12px var(--sustt-glow-primary-subtle);
}

/* Stagger delay */
.sustt-card-skeleton:nth-child(1) {
    animation-delay: 0.1s;
}
.sustt-card-skeleton:nth-child(2) {
    animation-delay: 0.25s;
}
.sustt-card-skeleton:nth-child(3) {
    animation-delay: 0.4s;
}
.sustt-card-skeleton:nth-child(4) {
    animation-delay: 0.55s;
}
.sustt-card-skeleton:nth-child(5) {
    animation-delay: 0.7s;
}
.sustt-card-skeleton:nth-child(6) {
    animation-delay: 0.85s;
}

#sustt-standings-container {
    position: relative;
    min-height: 200px;
}

#sustt-standings-container.is-loading {
    opacity: 0.6;
    pointer-events: none;
}

/* On masque les éléments de Blogus qui pourraient interférer */
.bs_upscr {
    display: none !important;
}

/* --- Keyframes (centralisés) --- */

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes susttCardReveal {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes susttFade {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes susttShimmer {
    0% {
        transform: translateX(-100%);
    }
    60% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(100%);
    }
}

@keyframes sk-loading {
    0% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0 50%;
    }
}

@keyframes susttSpin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes pulseGlow {
    from {
        box-shadow: 0 0 10px var(--sustt-accent-glow);
    }
    to {
        box-shadow: 0 0 24px var(--sustt-accent-glow);
    }
}

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

@keyframes revealUp {
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes pulseUp {
    0% {
        transform: translateX(-50%) scale(0.9);
    }
    50% {
        transform: translateX(-50%) scale(1.1);
    }
    100% {
        transform: translateX(-50%) scale(1);
    }
}