/**
 * SKJ General Administration - Royal Purple Neo-Glassmorphism Page Loader
 * Theme: Signature Royal Purple (#4338ca -> #696cff -> #7c3aed -> #9333ea)
 * Version: 1.0.0
 * Author: Antigravity
 */

/* Fullscreen Overlay */
.page-loader {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 255, 255, 0.78) !important;
    backdrop-filter: blur(14px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                visibility 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: all;
    user-select: none;
}

/* Hidden state when page is ready */
.page-loader.is-loaded {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Active state when transitioning to another page */
.page-loader.is-active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: all !important;
}

/* Glass Card Container */
.page-loader .loader-card {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(124, 58, 237, 0.22);
    border-radius: 24px;
    padding: 26px 36px;
    box-shadow: 0 16px 45px -10px rgba(105, 108, 255, 0.32),
                0 0 0 1px rgba(255, 255, 255, 0.8) inset,
                0 2px 8px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-width: 210px;
    animation: loaderPopIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes loaderPopIn {
    0% { transform: scale(0.9) translateY(10px); opacity: 0; }
    100% { transform: scale(1) translateY(0); opacity: 1; }
}

/* Spinner Wrap */
.page-loader .loader-spinner-container {
    position: relative;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Outer Gradient Ring */
.page-loader .loader-spinner-outer {
    position: absolute;
    inset: 0;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    border: 3.5px solid rgba(105, 108, 255, 0.14);
    border-top-color: #696cff;
    border-right-color: #7c3aed;
    border-bottom-color: #9333ea;
    animation: loaderSpinClockwise 0.85s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    box-shadow: 0 0 16px rgba(105, 108, 255, 0.35);
}

/* Inner Inverse Ring */
.page-loader .loader-spinner-inner {
    position: absolute;
    inset: 7px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 2.5px solid transparent;
    border-top-color: #fde047; /* Gold accent */
    border-left-color: #6366f1;
    animation: loaderSpinCounter 1.2s linear infinite;
}

/* Center Glowing Icon */
.page-loader .loader-center-icon {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #696cff;
    font-size: 1.55rem;
    animation: loaderPulse 1.4s ease-in-out infinite;
    filter: drop-shadow(0 0 8px rgba(105, 108, 255, 0.6));
}

@keyframes loaderSpinClockwise {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes loaderSpinCounter {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(-360deg); }
}

@keyframes loaderPulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(0.88); opacity: 0.75; }
}

/* Text Styling */
.page-loader .loader-text-group {
    text-align: center;
}

.page-loader .loader-title {
    font-size: 0.92rem;
    font-weight: 700;
    color: #383b8a;
    letter-spacing: -0.2px;
    margin-bottom: 2px;
}

.page-loader .loader-sub {
    font-size: 0.74rem;
    font-weight: 500;
    color: #8592a3;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}