/**
 * Upload Shell — progress bar, file name, and Win10-style copy animation.
 */

.upload-shell .upload-file-name,
.upload-shell .upload-box .upload-file-name {
    display: block;
    width: min(360px, 100%);
    max-width: min(360px, 100%);
    margin: 12px auto 0;
    text-align: center;
    word-break: break-word;
}

.upload-shell .upload-shell-progress-text,
.bottom-editor-section .bottom-editor-progress-text,
.inner-converter-section .inner-progress-text {
    display: none;
    width: min(360px, 100%);
    margin: 10px auto 0;
    text-align: center;
}

.upload-shell.is-converting .upload-shell-progress-text,
.upload-shell.is-success .upload-shell-progress-text,
.upload-shell .upload-box.is-converting .upload-shell-progress-text,
.upload-shell .upload-box.is-success .upload-shell-progress-text,
.inner-converter-section.is-converting .inner-progress-text,
.inner-converter-section.is-success .inner-progress-text,
.inner-upload-box.is-converting .inner-progress-text,
.inner-upload-box.is-success .inner-progress-text {
    display: block;
    text-align: center;
}

.upload-shell .upload-shell-success,
.upload-shell .upload-shell-error {
    text-align: center;
}

/* Theme-aware progress track and fill */
.upload-shell-progress,
.bottom-editor-progress,
.inner-progress {
    --softro-progress-fill: var(--red, #ff171f);
    --softro-progress-track: #ffe1e3;
    --softro-progress-glow: color-mix(in srgb, var(--softro-progress-fill) 18%, transparent);
}

.upload-shell-progress div,
.upload-shell-progress .softro-progress-fill,
.bottom-editor-progress div,
.bottom-editor-progress .softro-progress-fill,
.inner-progress div,
.inner-progress .softro-progress-fill {
    background: var(--softro-progress-fill);
    width: 0;
    transition: width 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.upload-shell-progress,
.bottom-editor-progress,
.inner-progress {
    background: var(--softro-progress-track);
}

/* Windows 10 copy-style shimmer while converting */
.upload-shell-progress.softro-progress-animating > div,
.upload-shell-progress.softro-progress-animating > .softro-progress-fill,
.bottom-editor-progress.softro-progress-animating > div,
.bottom-editor-progress.softro-progress-animating > .softro-progress-fill,
.inner-progress.softro-progress-animating > div,
.inner-progress.softro-progress-animating > .softro-progress-fill {
    position: relative;
    overflow: hidden;
    transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.upload-shell-progress.softro-progress-animating > div::after,
.upload-shell-progress.softro-progress-animating > .softro-progress-fill::after,
.bottom-editor-progress.softro-progress-animating > div::after,
.bottom-editor-progress.softro-progress-animating > .softro-progress-fill::after,
.inner-progress.softro-progress-animating > div::after,
.inner-progress.softro-progress-animating > .softro-progress-fill::after {
    content: '';
    position: absolute;
    top: 0;
    left: -45%;
    width: 45%;
    height: 100%;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.55) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    animation: softro-progress-shimmer 1.8s ease-in-out infinite;
    pointer-events: none;
}

@keyframes softro-progress-shimmer {
    0% {
        left: -45%;
    }

    100% {
        left: 145%;
    }
}

.upload-shell-progress.softro-progress-animating,
.bottom-editor-progress.softro-progress-animating,
.inner-progress.softro-progress-animating {
    animation: softro-progress-track-glow 2.4s ease-in-out infinite;
}

@keyframes softro-progress-track-glow {
    0%,
    100% {
        box-shadow: 0 0 0 0 var(--softro-progress-glow, rgba(255, 23, 31, 0));
    }

    50% {
        box-shadow: 0 0 0 2px var(--softro-progress-glow, rgba(255, 23, 31, 0.12));
    }
}

.is-converting .upload-shell-progress-text,
.upload-box.is-converting .upload-shell-progress-text,
.bottom-editor-upload-box.is-converting .bottom-editor-progress-text,
.bottom-editor-section.is-converting .bottom-editor-progress-text,
.inner-converter-section.is-converting .inner-progress-text,
.inner-upload-box.is-converting .inner-progress-text {
    animation: softro-progress-label-pulse 2.2s ease-in-out infinite;
}

@keyframes softro-progress-label-pulse {
    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.72;
    }
}

.upload-shell-progress-text,
.bottom-editor-progress-text,
.inner-progress-text {
    transition: opacity 0.25s ease;
}