grav-plugin-admin/themes/grav/scss/template/_safe-upgrade.scss

.remodal {
    .safe-upgrade-header, .safe-upgrade-body {
        padding: 0 1.5rem;
        h2 {
            padding-top: 0;
            margin-top: 0;
        }
        p {
            padding-left: 0;
        }
    }
    .safe-upgrade-body {
        margin-bottom: 1rem;
        
        .safe-upgrade-summary {
            p {
                margin: 0.25rem 0;
            }
        }
        .safe-upgrade-actions {
            margin-top: 1.5rem;
        }

        .safe-upgrade-loading {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            font-size: 1.05rem;
            padding: 1.5rem 0;
        }

        .safe-upgrade-progress {
            text-align: center;

            h3 {
                margin-bottom: 0.5rem;
                border-bottom: 1px solid rgba(0, 0, 0, 0.08);
                padding-bottom: 0.5rem;
            }

            .safe-upgrade-progress-bar {
                width: 100%;
                background: rgba(0, 0, 0, 0.1);
                border-radius: 4px;
                height: 10px;
                overflow: hidden;
                margin-top: 0.75rem;

                span {
                    display: block;
                    height: 100%;
                    background: #4dbc8b;
                    transition: width 0.3s ease;
                }

                &.is-active span {
                    animation: safe-upgrade-pulse 1.6s ease-in-out infinite;
                }
            }

            .safe-upgrade-status {
                margin-top: 0.5rem;
                font-size: 0.95rem;

                strong {
                    font-weight: 600;
                }
            }

            .progress-value {
                font-weight: 600;
                margin-top: 0.5rem;
            }
        }

        .safe-upgrade-result {
            h3 {
                margin-bottom: 0.5rem;
            }
        }

        .safe-upgrade-conflict-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            flex-wrap: wrap;

            strong {
                flex: 0 1 auto;
            }

            .safe-upgrade-decision {
                flex: 0 0 auto;
                min-width: 220px;
                max-width: 100%;

                select {
                    width: 100%;
                }
            }
        }
    }

}

@keyframes safe-upgrade-pulse {
    0% {
        filter: brightness(100%);
    }
    50% {
        filter: brightness(115%);
    }
    100% {
        filter: brightness(100%);
    }
}