/*
 * SPDX-FileCopyrightText: 2023 XWiki CryptPad Team <contact@cryptpad.org> and contributors
 *
 * SPDX-License-Identifier: AGPL-3.0-or-later
 */

.export_main() {
    #cp-export-container {
        font-size: 16px;
        display: flex;
        flex: 1;
        min-height: 0;
        align-items: center;
        justify-content: center;
        background-color: @cp_export-bg;
        color: @cp_export-fg;
        .cp-export-block {
            width: 800px;
            max-width: 90vw;
            .cp-export-progress-bar-container {
                height: 24px;
                background: @cp_loading-progress-bg;
                border: 1px solid @cp_loading-progress-bar-bg;
                width: 80%;
                margin: auto;
                position: relative;
                .cp-export-progress-bar {
                    height: 100%;
                    background: @cp_loading-progress-bar-bg; // Same color as loading screen bar
                    width: 0%;
                    display: inline-block;
                }
                .cp-export-progress-text {
                    position: absolute;
                    top: 0;
                    right: 0;
                    left: 0;
                    bottom: 0;
                    text-align: center;
                    font-weight: bold;
                }
            }
            & > p {
                color: @cp_export-hint;
            }
            .cp-export-progress {
                margin-bottom: 1rem;
                p {
                    margin-bottom: 0;
                    display: flex;
                    align-items: center;
                    padding: 5px 0;
                    .fa {
                        width: 25px;
                    }
                }
            }
            .cp-export-actions {
                display: flex;
                flex-flow: row-reverse;
                .btn-default, .btn-primary {
                    margin-left: 20px;
                }
            }
            .cp-export-errors {
                display: none;
                overflow-x: auto;
                max-height: 300px;
                background: @cp_export-error-bg;
                padding: 5px 20px;
                margin-top: 1rem;
                & > p {
                    margin: 0;
                }
                .cp-export-errors-list {
                    & > div {
                        padding: 5px 10px;
                        margin: 5px 0;
                        background: @cp_export-error-bg2;
                        .title {
                            font-weight: bold;
                        }
                        .link {
                            padding: 0 20px;
                            font-size: 14px;
                            a {
                                color: @cp_loading-link;
                            }
                        }
                        .reason {
                            padding: 0 20px;
                            color: @cp_export-hint;
                        }
                    }
                }
            }
        }
    }
}
