/* SavingsArchitect Ultra-Modern Loadscreen */
.page-loading,
.se-pre-con,
.se-pre-con2 {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: radial-gradient(ellipse at center, rgba(14, 165, 233, 0.12) 0%, rgba(255, 255, 255, 0.96) 55%, rgba(248, 250, 252, 0.99) 100%) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    z-index: 999999 !important;
}

.se-pre-con2 {
    display: none;
}

/* Dark mode loading screen */
.dark .page-loading,
.dark .se-pre-con,
.dark .se-pre-con2,
html.dark .page-loading,
html.dark .se-pre-con,
html.dark .se-pre-con2 {
    background: radial-gradient(ellipse at center, rgba(14, 165, 233, 0.18) 0%, rgba(15, 23, 42, 0.96) 55%, rgba(11, 17, 32, 0.99) 100%) !important;
}

.page-loading-inner {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    text-align: center !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.loading-container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    position: relative !important;
}

/* Floating particles background */
.loading-particles {
    position: absolute !important;
    width: 280px !important;
    height: 280px !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    pointer-events: none !important;
}

.particle {
    position: absolute !important;
    width: 5px !important;
    height: 5px !important;
    background: linear-gradient(45deg, #0ea5e9, #6366f1) !important;
    border-radius: 50% !important;
    opacity: 0.7 !important;
    animation: floatParticle 4s ease-in-out infinite !important;
}

.particle:nth-child(1) { top: 15% !important; left: 20% !important; animation-delay: 0s !important; }
.particle:nth-child(2) { top: 80% !important; left: 75% !important; animation-delay: 0.6s !important; }
.particle:nth-child(3) { top: 65% !important; left: 15% !important; animation-delay: 1.2s !important; }
.particle:nth-child(4) { top: 25% !important; left: 80% !important; animation-delay: 1.8s !important; }
.particle:nth-child(5) { top: 75% !important; left: 35% !important; animation-delay: 2.4s !important; }
.particle:nth-child(6) { top: 10% !important; left: 55% !important; animation-delay: 3s !important; }

@keyframes floatParticle {
    0%, 100% { transform: translateY(0px) translateX(0px); opacity: 0.3; }
    50% { transform: translateY(-22px) translateX(12px); opacity: 0.9; }
}

.loading-animation {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 130px !important;
    height: 130px !important;
    margin-bottom: 1.5rem !important;
    position: relative !important;
    filter: drop-shadow(0 0 24px rgba(14, 165, 233, 0.35)) !important;
}

/* Outer orbital rings */
.loading-animation .orbit-ring {
    position: absolute !important;
    border-radius: 50% !important;
    border: 2px solid rgba(14, 165, 233, 0.15) !important;
}

.orbit-ring:nth-child(1) {
    width: 100% !important;
    height: 100% !important;
    border-top: 2.5px solid #0ea5e9 !important;
    border-right: 2.5px solid rgba(14, 165, 233, 0.45) !important;
    animation: rotateOrbit 2s linear infinite !important;
}

.orbit-ring:nth-child(2) {
    width: 80% !important;
    height: 80% !important;
    border-bottom: 2.5px solid #38bdf8 !important;
    border-left: 2.5px solid rgba(56, 189, 248, 0.45) !important;
    animation: rotateOrbit 2.6s linear infinite reverse !important;
}

.orbit-ring:nth-child(3) {
    width: 60% !important;
    height: 60% !important;
    border-top: 2px solid #0284c7 !important;
    border-right: 2px solid rgba(2, 132, 199, 0.45) !important;
    animation: rotateOrbit 3.2s linear infinite !important;
}

@keyframes rotateOrbit {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Glowing core */
.loading-animation .core {
    position: absolute !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #0ea5e9 0%, #4f46e5 100%) !important;
    box-shadow: 0 0 20px rgba(14, 165, 233, 0.7), 0 0 35px rgba(79, 70, 229, 0.4) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    animation: pulseCore 2s ease-in-out infinite !important;
}

@keyframes pulseCore {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 15px rgba(14, 165, 233, 0.6), 0 0 30px rgba(79, 70, 229, 0.3);
    }
    50% {
        transform: scale(1.1);
        box-shadow: 0 0 25px rgba(14, 165, 233, 0.95), 0 0 45px rgba(79, 70, 229, 0.6);
    }
}

.loading-text {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: #0284c7 !important;
    animation: pulseText 2s ease-in-out infinite !important;
}

.dark .loading-text,
html.dark .loading-text {
    color: #38bdf8 !important;
}

@keyframes pulseText {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}