/**
 * TipArena FX — admin, leaderboard, live zápasy, chat, profil, víťazstvo
 * Farby: len existujúce tokeny (--accent-cyan, --accent-neon, …)
 */

/* ========== ADMIN ZÁLOŽKY — posúvajúci sa indikátor ========== */
.admin-tabs-nav {
    position: relative;
}
.admin-tab-indicator {
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 8px;
    background: rgba(0, 240, 255, 0.1);
    border: 1px solid rgba(0, 240, 255, 0.28);
    box-shadow: 0 0 16px rgba(0, 240, 255, 0.12);
    transition: left 0.38s cubic-bezier(0.34, 1.45, 0.64, 1),
                width 0.32s ease,
                top 0.32s ease,
                height 0.32s ease;
    pointer-events: none;
    z-index: 0;
}
.admin-tab-btn {
    position: relative;
    z-index: 1;
    transition: color 0.22s ease, transform 0.18s ease;
}
.admin-tab-btn:active {
    transform: scale(0.97);
}
.admin-tab-panel:not([hidden]) {
    animation: fxAdminPanelIn 0.38s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes fxAdminPanelIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ========== LEADERBOARD — stagger + zvýraznenie môj riadok ========== */
body[data-view="leaderboard"] .lb-podium-slot {
    animation: fxLbPodiumIn 0.55s cubic-bezier(0.34, 1.35, 0.64, 1) both;
}
body[data-view="leaderboard"] .lb-podium-slot:nth-child(1) { animation-delay: 0.05s; }
body[data-view="leaderboard"] .lb-podium-slot:nth-child(2) { animation-delay: 0.12s; }
body[data-view="leaderboard"] .lb-podium-slot:nth-child(3) { animation-delay: 0.19s; }
@keyframes fxLbPodiumIn {
    from { opacity: 0; transform: translateY(24px) scale(0.92); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

body[data-view="leaderboard"] .leaderboard-table tbody .lb-row {
    animation: fxLbRowIn 0.42s cubic-bezier(0.22, 1, 0.36, 1) both;
}
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(1) { animation-delay: 0.04s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(2) { animation-delay: 0.07s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(3) { animation-delay: 0.10s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(4) { animation-delay: 0.13s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(5) { animation-delay: 0.16s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(6) { animation-delay: 0.19s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(7) { animation-delay: 0.22s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(8) { animation-delay: 0.25s; }
body[data-view="leaderboard"] .leaderboard-table tbody .lb-row:nth-child(n+9) { animation-delay: 0.28s; }
@keyframes fxLbRowIn {
    from { opacity: 0; transform: translateX(-10px); }
    to { opacity: 1; transform: translateX(0); }
}

.leaderboard-table .lb-row-me {
    box-shadow: inset 3px 0 0 var(--accent-cyan) !important;
    animation: fxLbRowIn 0.42s cubic-bezier(0.22, 1, 0.36, 1) both, fxLbMeGlow 2.8s ease-in-out 0.5s infinite;
}
@keyframes fxLbMeGlow {
    0%, 100% {
        box-shadow: inset 3px 0 0 var(--accent-cyan), 0 0 0 rgba(0, 240, 255, 0) !important;
    }
    50% {
        box-shadow: inset 3px 0 0 var(--accent-neon), 0 0 22px rgba(0, 240, 255, 0.1) !important;
    }
}
.leaderboard-table .lb-row-me .lb-rank-animate {
    color: var(--accent-cyan);
    text-shadow: 0 0 12px rgba(0, 240, 255, 0.35);
}

/* ========== LIVE ZÁPASY — cyan aura (LIVE badge ostáva červený) ========== */
.match-card.match-live,
.match-card.match-live-pulse {
    animation: fxLiveCardGlow 2.4s ease-in-out infinite !important;
}
@keyframes fxLiveCardGlow {
    0%, 100% {
        box-shadow: 0 0 0 1px rgba(0, 240, 255, 0.12), 0 0 14px rgba(0, 240, 255, 0.05);
        border-color: rgba(0, 240, 255, 0.2) !important;
    }
    50% {
        box-shadow: 0 0 0 1px rgba(0, 240, 255, 0.35), 0 0 26px rgba(0, 255, 170, 0.12);
        border-color: rgba(0, 255, 170, 0.28) !important;
    }
}
.match-live-badge {
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.45);
}

/* ========== CHAT — slide-in + typing dots ========== */
.chat-msg-row.chat-msg-new {
    animation: fxChatSlideIn 0.4s cubic-bezier(0.22, 1, 0.36, 1) both !important;
}
.chat-msg-row.chat-msg-new.chat-msg-own {
    animation-name: fxChatSlideInOwn !important;
}
@keyframes fxChatSlideIn {
    from { opacity: 0; transform: translateX(-16px) scale(0.97); }
    to { opacity: 1; transform: translateX(0) scale(1); }
}
@keyframes fxChatSlideInOwn {
    from { opacity: 0; transform: translateX(16px) scale(0.97); }
    to { opacity: 1; transform: translateX(0) scale(1); }
}
.chat-msg-new .chat-bubble {
    animation: fxBubblePop 0.35s cubic-bezier(0.34, 1.4, 0.64, 1) 0.08s both;
}
@keyframes fxBubblePop {
    from { transform: scale(0.88); }
    to { transform: scale(1); }
}

.chat-typing-indicator.chat-typing-fx {
    display: flex;
    align-items: center;
    gap: 6px;
    font-style: normal;
    animation: none;
}
.chat-typing-dots {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 14px;
}
.chat-typing-dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--accent-cyan);
    animation: fxTypingDot 1.2s ease-in-out infinite;
    box-shadow: 0 0 6px rgba(0, 240, 255, 0.45);
}
.chat-typing-dots span:nth-child(2) { animation-delay: 0.15s; }
.chat-typing-dots span:nth-child(3) { animation-delay: 0.3s; }
@keyframes fxTypingDot {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.35; }
    30% { transform: translateY(-5px); opacity: 1; }
}

/* ========== PROFIL — avatar pulse po uložení ========== */
.profile-card .user-avatar-wrap.avatar-save-pulse {
    animation: fxAvatarSavePulse 1.6s cubic-bezier(0.34, 1.3, 0.64, 1);
}
.profile-card .user-avatar-wrap.avatar-save-pulse::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 2px solid var(--accent-neon);
    animation: fxAvatarRing 1.6s ease-out;
    pointer-events: none;
}
.profile-card .user-avatar-wrap {
    position: relative;
}
@keyframes fxAvatarSavePulse {
    0% { transform: scale(1); filter: brightness(1); }
    35% { transform: scale(1.08); filter: brightness(1.15); }
    100% { transform: scale(1); filter: brightness(1); }
}
@keyframes fxAvatarRing {
    0% { opacity: 1; transform: scale(0.9); }
    100% { opacity: 0; transform: scale(1.35); }
}

/* ========== VÍŤAZSTVO / CONFETTI — vylepšený overlay ========== */
.victory-overlay.victory-fx-enhanced .victory-content {
    animation: fxVictoryPop 0.65s cubic-bezier(0.34, 1.45, 0.64, 1) both;
}
.victory-overlay.victory-fx-enhanced .victory-crown {
    animation: fxCrownSpin 0.8s cubic-bezier(0.34, 1.5, 0.64, 1) both, crownBounce 1s ease 0.8s infinite alternate;
}
.victory-overlay.victory-fx-enhanced .victory-burst {
    animation: fxVictoryBurst 1.8s ease-in-out infinite;
}
@keyframes fxVictoryPop {
    0% { transform: scale(0.4) rotate(-8deg); opacity: 0; filter: blur(4px); }
    100% { transform: scale(1) rotate(0); opacity: 1; filter: blur(0); }
}
@keyframes fxCrownSpin {
    0% { transform: scale(0) rotate(-180deg); opacity: 0; }
    100% { transform: scale(1) rotate(0); opacity: 1; }
}
@keyframes fxVictoryBurst {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.05); }
}

/* Arena accept flash enhancement */
.btn-arena-accept.duel-accept-flash {
    animation: fxArenaAccept 0.55s cubic-bezier(0.34, 1.4, 0.64, 1);
}
@keyframes fxArenaAccept {
    0% { transform: scale(1); box-shadow: none; }
    40% { transform: scale(1.06); box-shadow: 0 0 24px rgba(0, 255, 170, 0.45); }
    100% { transform: scale(1); box-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
    .admin-tab-indicator,
    .admin-tab-panel:not([hidden]),
    body[data-view="leaderboard"] .lb-podium-slot,
    body[data-view="leaderboard"] .leaderboard-table tbody .lb-row,
    .leaderboard-table .lb-row-me,
    .match-card.match-live,
    .match-card.match-live-pulse,
    .chat-msg-row.chat-msg-new,
    .chat-msg-new .chat-bubble,
    .chat-typing-dots span,
    .profile-card .user-avatar-wrap.avatar-save-pulse,
    .profile-card .user-avatar-wrap.avatar-save-pulse::after,
    .victory-overlay.victory-fx-enhanced .victory-content,
    .victory-overlay.victory-fx-enhanced .victory-crown,
    .btn-arena-accept.duel-accept-flash {
        animation: none !important;
        transition: none !important;
    }
}
