/* Style the menu of mobile */
.AppDataMenuMobile {
    display: none;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;

    width: 100%;

    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 10;
}

    @media screen and (max-width: 900px){
        .AppDataMenuMobile {
            display: flex;
        }

    }

    .AppDataMenuMobile__Header {
        display: none;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;

        background: rgb(255, 255, 255);

        width: 100%;
        height: auto;

        padding: 1.7vw;
    }

        .AppDataMenuMobile__Header > .ButtonContext {
            padding: var(--size-05);
            margin-right: var(--size-04);
        }

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

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

            .AppDataMenuMobileHeader__Icon > img {
                width: var(--icon-button-size-options);
                height: auto;
                max-width: var(--icon-button-size-options);
            }

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

            text-align: left;
            white-space: normal;
        }

            .AppDataMenuMobileHeader__Title > h6 {
                font-size: var(--font-size-context);
            }

    .AppDataMenuMobile__Links {
        display: none;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;

        width: 100%;
        height: 100%;

        overflow-y: auto;

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

        .AppDataMenuMobileLinks__Category {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: flex-start;

            width: 100%;

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

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

                color: rgba(127, 127, 127);

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

            .AppDataMenuMobileLinksCategory__Data {
                display: grid;
                align-items: flex-start;
                justify-content: flex-start;

                background: rgb(255, 255, 255);
                border: 1px solid rgb(237, 237, 237);
                border-radius: var(--size-07);
                
                grid-template-columns: repeat(auto-fill, minmax( var(--button-size-menu-init), 1fr ));

                width: 100%;

                gap: var(--size-07);
                padding: var(--size-07);
            }

                .AppDataMenuMobileLinksCategory__Data > a {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: flex-start;

                    width: 100%;
                    height: 100%;
                }

                    .AppDataMenuMobileLinksCategory__Data > a > img {
                        width: 100%;
                        height: auto;
                        max-width: var(--icon-view-size);

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

                    .AppDataMenuMobileLinksCategory__Data > a > span {
                        font-size: var(--font-size-context);
                        text-align: center;
                    }

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

        position: relative;
        z-index: 1;

        width: 100%;
        
        padding: var(--size-07);
    }

    @media screen and (max-width: 650px){
        .AppDataMenuMobile__Navigation {
            padding: 1.7vw;
        }
    }


        .AppDataMenuMobileNavigation__Links {
            display: flex;
            flex-direction: row;
            align-items: flex-end;
            justify-content: flex-start;

            width: 100%;

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

            .AppDataMenuMobileNavigation__Links > * {
                margin-right: var(--size-07);
            }

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

            height: 100%;
        }