﻿/*
 * Xdir Loading 等待加载效果（四色圆点依次跳动）Xdir 增强 2026-10-27
 * www.xuxiaokun.com
 */

#loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 15000;
    background: rgba(255,255,255,.86);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .3s ease;
}
#loading .xdir-load-dots {
    display: flex;
    align-items: center;
    gap: 10px;
}
#loading .xdir-load-dots span {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    animation: xdir-load-bounce .7s infinite ease-in-out both;
}
#loading .xdir-load-dots span:nth-child(1) { background: #ff5b5b; animation-delay: -.45s; }
#loading .xdir-load-dots span:nth-child(2) { background: #ffb02e; animation-delay: -.30s; }
#loading .xdir-load-dots span:nth-child(3) { background: #3ec46d; animation-delay: -.15s; }
#loading .xdir-load-dots span:nth-child(4) { background: #1E9FFF; animation-delay: 0s; }
@keyframes xdir-load-bounce {
    0%, 80%, 100% { transform: scale(0); opacity: .4; }
    40% { transform: scale(1); opacity: 1; }
}
