/******************************************* List_tabs *******************************************/
.layout-group-col{
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    height: 100%; width: 100%;
}
.layout-group-row{
    display: flex; flex-direction: row; justify-content: center; align-items: center;
    height: 100%; width: 100%;
}
.layout-menu-tabs{
    display: flex; flex-direction: column; 
    /* justify-content: flex-start;  */
    justify-content: space-between;
    align-items: center;
    height: 100%; width: 180px; gap: 20px; padding: 10px 0; background-color: var(--grey-300);
}
.layout-group-card{ /* dir column pour les liste de game manager */
    display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start;
    height: 95%; width: 100%; padding: 10px; 
    gap: 10px; /* pour gameManager game_list_xxx_views */
    /* overflow: scroll; */
    overflow-y: auto;
}
.layout-group-card.selected{
    display: flex;
}
.layout-tab{
    display: flex; flex-direction: row; 
    justify-content: center; align-items: center;
    height: 50px; width: 100%; font-size: 21px; cursor: pointer; 
    color: var(--grey-600);
    /* transition: background-color 0.5s; background-color: var(--grey-200); */
}
.layout-tab.selected{
    /* background-color: var(--grey-800) !important;  */
    background-color: var(--primary-color) !important;
    color: var(--grey-200);
    border-radius: 10px;
    width: 90%;
    box-shadow: 0 1px 3px 1px var(--grey-600);
}
.layout-tab.selected div{
    color: var(--grey-200)
}

/******************************************* icon-text-btn *******************************************/
.layout-icon-text-mini-btn{
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    height: auto; width: 100%; padding: 5px 0;
    cursor: pointer; transition: background-color 0.5s; /*border-radius: 8px;*/
}
.layout-icon-text-mini-btn.selected{
    background-color: var(--primary-color) !important;
    color: var(--grey-200);
    border-radius: 10px;
    box-shadow: 0 1px 3px 1px var(--grey-600);
    width: 90%;
}
.layout-icon-text-mini-btn span{ /* icon */
    /* width: 26px; height: auto; */ font-size: 36px;
} 
.layout-icon-text-mini-btn div{ /* text */
    font-size: 13px; text-align: center; height: 16px; color: var(--grey-600);
}