/* Style the identification */
.AppIdentification {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;

    position: relative;

    height: 100%;

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

    .AppIdentification > .AppDataBrowser__LoadingResults,
    .AppIdentificationHeader__Profils > .AppDataBrowser__LoadingResults {
        align-items: center;
        justify-content: center;

        background: rgb(255, 255, 255);
        border-radius: var(--size-07);

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

        width: 100%;
        height: 100%;
    }

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

        width: 100%;
    }
    
    @media screen and (max-width: 900px){
        .AppIdentification__Header {
            justify-content: space-between;
            height: 100%;
        }
    }

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

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

        @media screen and (max-width: 650px){
            .AppIdentificationHeader__Logo {
                justify-content: center;
            }
        }

            .AppIdentificationHeader__Logo > img {
                border: 1px solid rgb(217, 217, 217);
                border-radius: 100%;

                width: 100%;
                height: auto;
                max-width: var(--icon-company-size);

                padding: var(--size-02);
                margin-right: var(--size-07);
            }

            @media screen and (max-width: 650px){
                .AppIdentificationHeader__Logo > img {
                    display: none;
                }
            }

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

                color: rgb(57, 57, 57);
                font-size: var(--size-16);
                text-transform: uppercase;
            }

                .AppIdentificationHeaderLogo__Brand > span:first-child {
                    color: rgb(157, 217, 97);
                }

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

            position: relative;

            width: 100%;
            height: 100%;

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

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

                background: rgb(255, 255, 255);
                border: 1px solid rgb(237, 237, 237);
                border-radius: var(--size-07);

                width: 100%;
                height: 100%;
                max-height: var(--size-7);

                padding: var(--size-04);
                margin-left: var(--size-07);

                transition: 0.4s;
            }

                .AppIdentificationHeaderProfils__Item:hover {
                    transition: 0.2s;
                    background: rgb(250, 250, 250);
                }

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

                .AppIdentificationHeaderProfilsItem__Functions {
                    display: none;
                    flex-direction: row;
                    align-items: center;
                    justify-content: flex-end;

                    width: 100%;

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

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

                    border: 1px solid rgb(217, 217, 217);
                    border-radius: 100%;

                    width: var(--size-27);
                    height: var(--size-27);
                    min-width: var(--size-27);
                    min-height: var(--size-27);

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

                .AppIdentificationHeaderProfilsItem__Name {
                    display: block;

                    text-align: center;
                    word-break: break-all;

                    width: 100%;
                    height: 100%;

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

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

                    color: rgb(127, 127, 127);
                    text-align: center;
                    font-size: var(--font-size-context);

                    width: 100%;
                }

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

            text-align: center;

            width: 100%;

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

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

        border: 1px solid rgb(237, 237, 237);
        border-radius: var(--size-07);

        width: 100%;

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

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

            width: 100%;
        }

            .AppIdentificationFormInput__Title {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;

                width: 100%;

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

                .AppIdentificationFormInput__Title > span:nth-of-type(1) {
                    text-align: left;
                }

                .AppIdentificationFormInput__Title > span:nth-of-type(2) {
                    color: rgb(237, 57, 57);
                    text-align: right;
                }

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

                width: 100%;

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

                .AppIdentificationFormInput__Data > .ButtonInput {
                    width: 100%;
                }
            
            .AppIdentification__Form > button {
                width: 100%;
                margin-top: var(--size-07);
            }

    .AppIdentification__Functions {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;

        width: 100%;
    }

        .AppIdentification__Functions > button {
            width: 100%;
        }