/* Style the app of data for browser */
.AppDataBrowser {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;

    background: rgb(255, 255, 255);
    background-size: auto;
    background-position: center;
    background-repeat: repeat;
    border-top: 1px solid rgb(237, 237, 237);
    border-left: 1px solid rgb(237, 237, 237);
    border-right: 1px solid rgb(237, 237, 237);
    border-top-left-radius: var(--size-07);
    border-top-right-radius: var(--size-07);

    width: 100%;
    height: 100%;

    overflow-y: auto;
    overflow-x: hidden;
}

@media screen and (max-width: 900px){
    .AppDataBrowser::-webkit-scrollbar { width: 0px; height: 0px; }

    .AppDataBrowser {
        border: unset;
        padding-bottom: var(--size-3);
    }
}

    .AppDataBrowser__Warning {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-items: center;

        width: 100%;

        grid-column: span 2;
    }

        .AppDataBrowserWarning__Icon {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;

            margin-bottom: var(--size-04);
        }

            .AppDataBrowserWarning__Icon > img {
                width: 100%;
                height: auto;
                max-width: var(--icon-loading-size);
            }

        .AppDataBrowserWarning__Message {
            display: block;

            font-weight: 600;
            text-align: center;
        }

    .AppDataBrowser__Loading {
        display: none;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        background: rgb(255, 255, 255);
        border-left: 1px solid rgb(237, 237, 237);
        border-right: 1px solid rgb(237, 237, 237);

        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 77;

        width: 100%;
        height: 100%;

        padding: var(--size-17);
    }

        .AppDataBrowserLoading__Icon {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;

            margin-bottom: var(--size-07);
        }

            .AppDataBrowserLoading__Icon > img {
                width: 100%;
                height: auto;
                max-width: var(--icon-loading-big-size);
            }

        .AppDataBrowserLoading__Header {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;

            width: 70%;

            margin-bottom: var(--size-07);
        }

        @media screen and (max-width: 650px){
            .AppDataBrowserLoading__Header {
                width: auto;
            }
        }

            .AppDataBrowserLoadingHeader__Title {
                display: block;
                text-align: center;
            }

            .AppDataBrowserLoadingHeader__Description {
                display: block;

                text-align: center;
                white-space: normal;
                word-break: break-word;
            }

        .AppDataBrowserLoading__Functions {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;

            width: 100%;
        }

        @media screen and (max-width: 650px){
            .AppDataBrowserLoading__Functions {
                flex-direction: column;
            }
        }

            .AppDataBrowserLoadingFunctions__Item {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;

                margin-left: var(--size-07);
            }

                .AppDataBrowserLoadingFunctions__Item:nth-of-type(1){
                    margin-left: unset;
                }

            @media screen and (max-width: 650px){
                .AppDataBrowserLoadingFunctions__Item {
                    width: 100%;

                    margin-left: unset;
                    margin-bottom: var(--size-04);
                }

                    .AppDataBrowserLoadingFunctions__Item > a,
                    .AppDataBrowserLoadingFunctions__Item > button {
                        width: 100%;
                    }
            }

    .AppDataBrowser__LoadingDefault {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        background: rgb(255, 255, 255);

        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 76;

        width: 100%;
        height: 100%;

        padding: var(--size-17);

        opacity: 1.0;
        transition: 0.2s;
    }

        .AppDataBrowser__LoadingDefault {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;

            margin-bottom: var(--size-07);
        }

            .AppDataBrowser__LoadingDefault > img {
                width: 100%;
                height: auto;
                max-width: var(--icon-loading-big-size);
            }

    .AppDataBrowser__LoadingResults {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-items: center;

        width: 100%;

        grid-column: span 2;
    }

    @media screen and (max-width: 650px){
        .AppDataBrowser__LoadingResults {
            grid-column: span 1;
        }
    }

        .AppDataBrowser__LoadingResults > img {
            width: 100%;
            height: auto;
            max-width: var(--icon-loading-size);

            opacity: 0.0;
            transition: 0.7s;
        }