/* Style the app of tasks for preview on list */
.AppTasksList {
    display: grid;
    align-items: flex-start;
    justify-content: flex-start;

    grid-template-columns: repeat(auto-fill, minmax( 45%, 1fr ));

    width: 100%;

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

@media screen and (max-width: 900px){
    .AppTasksList {
        padding: var(--size-07);
    }
}

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

            grid-template-columns: none;

            gap: none;
        }
    }

    .AppTasksList__Folder {
        display: flex;
        flex-direction: column;
        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);

        width: 100%;
        height: 100%;
        min-height: 10vw;

        padding: var(--size-07);

        transition: 0.4s;
    }

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

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

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

            width: 100%;
            height: 100%;

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

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

                width: 100%;

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

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

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

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

                        opacity: 0.7;
                        transition: 0.4s;
                    }

                        .AppTasksListFolder__Information:hover > .AppTasksListFolderInformationHeader__Icon > img {
                            transition: 0.2s;
                            opacity: 1.0;
                        }

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

                    width: 100%;
                }

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

                        text-align: left;
                    }

                    .AppTasksListFolderInformationHeaderData__Status {
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        
                        background: rgba(235, 235, 235, 0.4);
                        border: 0.017cm solid rgb(225, 225, 225);
                        border-radius: var(--size-07);
                        
                        font-size: var(--font-size-context);
                        font-weight: 600;

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

                        /* .AppTasksListFolderInformationHeaderData__StatusGreen {
                            background: rgba(157, 217, 97, 0.1);
                            border: 0.017cm solid rgb(157, 217, 97);
                            color: rgb(147, 197, 87);
                        }

                        .AppTasksListFolderInformationHeaderData__StatusRed {
                            background: rgba(237, 57, 57, 0.1);
                            border: 0.017cm solid rgb(237, 57, 57);
                            color: rgb(237, 57, 57);
                        }

                        .AppTasksListFolderInformationHeaderData__StatusBlue {
                            background: rgba(57, 127, 237, 0.1);
                            border: 0.017cm solid rgb(57, 127, 237);
                            color: rgb(57, 127, 237);
                        }

                        .AppTasksListFolderInformationHeaderData__StatusGrey {
                            background: rgba(235, 235, 235, 0.4);
                            border: 0.017cm solid rgb(225, 225, 225);
                            font-weight: 600;
                        } */

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

                width: 100%;
            }

                .AppTasksListFolderInformation__Name > a:hover {
                    color: rgb(57, 57, 57);
                }

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

            width: 100%;
        }

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

                width: 100%;

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

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

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

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

                        opacity: 0.7;
                        transition: 0.4s;
                    }

                        .AppTasksListFolder__Information:hover > .AppTasksListFolderPerformersHeader__Icon > img {
                            transition: 0.2s;
                            opacity: 1.0;
                        }

            .AppTasksListFolderPerformers__Profils {
                display: flex;
                flex-wrap: wrap;
                align-items: flex-start;
                justify-content: flex-start;

                width: 100%;
            }

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

                    /* background: url( '/assets/images/photo-test.jpeg' );
                    background-size: cover;
                    background-position: center;
                    background-repeat: no-repeat; */
                    border: 1px solid rgb(217, 217, 217);
                    border-radius: 100%;

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

                    margin-top: var(--size-03);
                    margin-right: var(--size-03);
                }