/* OVERLAY */
.ps-progress-overlay {
    position: fixed;
    inset: 0;

    display: flex;
    justify-content: center;
    align-items: center;

    background: radial-gradient(circle at top, rgba(20, 30, 60, 0.6), rgba(0,0,0,0.75));

    backdrop-filter: blur(6px);

    z-index: 10000;
}

/* CONTAINER */
.ps-progress-container {
    width: 85%;
    max-width: 320px;

    position: relative;

    background: linear-gradient(145deg, rgba(30,30,40,0.95), rgba(15,15,25,0.95));
    border: 1px solid rgba(255,255,255,0.08);

    border-radius: 18px;
    padding: 24px;

    text-align: center;

    box-shadow:
        0 20px 60px rgba(0,0,0,0.7),
        inset 0 1px 0 rgba(255,255,255,0.05);

    animation: popIn 0.35s ease forwards;
}

/* ENTRY ANIMATION */
@keyframes popIn {
    from {
        opacity: 0;
        transform: scale(0.85) translateY(10px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* EXIT */
.ps-progress-container.hide {
    animation: popOut 0.25s ease forwards;
}

@keyframes popOut {
    from {
        opacity: 1;
        transform: scale(1);
    }
    to {
        opacity: 0;
        transform: scale(0.9);
    }
}

/* SPINNER */
.ps-progress-spinner {
    width: 44px;
    height: 44px;

    margin: 0 auto 16px;

    border-radius: 50%;

    border: 4px solid rgba(255,255,255,0.12);
    border-top: 4px solid #4da3ff;

    box-shadow: 0 0 20px rgba(77,163,255,0.4);

    animation: spin 0.9s linear infinite;
}

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

/* TEXT */
.ps-progress-title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 6px;
}

.ps-progress-message {
    color: #cfd6e4;
    font-size: 14px;
}

.ps-progress-subtext {
    color: #8ea0b8;
    font-size: 12px;
    margin-top: 6px;
}

/* COUNTDOWN BADGE */
.ps-countdown-badge {
    position: absolute;
    top: 10px;
    left: 10px;

    width: 28px;
    height: 28px;

    display: flex;
    justify-content: center;
    align-items: center;

    border-radius: 8px;

    font-size: 13px;
    font-weight: bold;

    color: #fff;

    background: linear-gradient(135deg, #ff4d4d, #ff8a00);

    box-shadow: 0 0 12px rgba(255, 80, 80, 0.4);
}

/* countdown pulse effect */
.ps-countdown-badge.pulse {
    transform: scale(1.2);
    transition: transform 0.2s ease;
}