
.dialog_group{
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    top: 0;
    position: fixed;
    background: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
    z-index: 100;

}

.dialog_container{
    display: flex;
    flex-direction: column;
    height: max-content;
    padding: 20px;
    margin: 10px;
    border-radius: 20px;
    background-color: var(--colorWhite);
    max-height: 90%;
    max-width: 70%;
    resize: both;
    overflow: auto;

}

.dialog_items{
    flex-grow: 1;
    overflow: auto;
}

.dialog_commands{
    margin-top: 20px;
    display: flex;
}

.dialog_btn_command{
    cursor: pointer;
    background-color: var(--colorHint);
    border-radius: var(--borderRadius);
    padding: 5px 10px 5px 10px;
    width: max-content;
    margin-right: 10px;
}

.dialog_btn_command:hover{
    background-color: var(--colorSelect);
}

.dialog_btn_command_a{

}

.dialog_btn_command_text{
    color: var(--colorWhite);
}

.dialog_head{
    padding: 5px;
    text-align: center;
    color: var(--colorHead);
    font-weight: 600;
}

.dialog_desc{
    text-align: center;
    color: var(--colorText);
}

.dialog_btn_ok{
    margin-right: 10px;
    cursor: pointer;
    background-color: #2a2a2a;
    border-radius: 10px;
    padding: 10px 20px 10px 20px;
    width: max-content;

}

.dialog_btn_ok:hover{
    background-color: #676767;

}

.dialog_btn_cancel{
    /* height: max-content; */
    margin-right: 10px;
    cursor: pointer;
    background-color: var(--colorBtnCancel);
    border-radius: 10px;
    padding: 10px 10px 10px 10px;
    width: max-content;

}

.dialog_btn_cancel:hover{
    background-color: var(--colorWhite);
}

.dialog_btn_delete{
    cursor: pointer;
    background-color: #eeeeee;
    border-radius: 10px;
    padding: 10px 10px 10px 10px;
    width: max-content;
    display: block;
    margin-left: auto;

}

.dialog_btn_delete:hover{
    background-color: var(--colorRed);
}

.dialog_btn_text_other{
    color: var(--colorText);
}

.dialog_group_btn{
    display: flex;
    justify-content: start;
    margin-top: 20px;

}

.dialog_btn_text{
    color: var(--colorWhite);
}

.dialog_icon_container{
    width: 100%;
    overflow: hidden;
}

.dialog_icon {
    width: 100%;
    object-fit: contain;
    background: var(--colorBlack);
    border-radius: var(--borderRadius);
    margin-top: 20px;
    height: calc(100% - 75px);
}

.dialog_input_val{
    font-size: 16px;
    margin-top: 20px;
    border-radius: var(--borderRadius);
    border-style: solid;
    padding: 10px;
    min-width: 300px;
    min-height: 80px;
}

.dialog_input_val_one{
    font-size: 16px;
    margin-top: 20px;
    border-radius: var(--borderRadius);
    border-style: solid;
    padding: 10px;
    min-width: 300px;
}

.dialog_item_name{
    margin-top: auto;
    margin-bottom: auto;
    width: 100%;
    margin-left: 5px;

}

.dialog_item_id{
    min-width: max-content;
    margin-top: auto;
    margin-bottom: auto;
    color: #606060;
    font-size: 14px;

}

.dialog_item{
    background: #eeeeee;
    border-radius: 15px;
    padding: 5px 10px;
    margin: 5px;
    cursor: pointer;
    display: flex;

}

.dialog_item:hover{
    background: #a8a7a7;

}

.dialog_list{
    margin-top: 20px;
    display: flex;
    max-width: 400px;
    flex-wrap: wrap;
    justify-content: center;
}

.block_container{
    display: grid;
    margin-top: 20px;
}

.block_name{
    font-weight: 600;
    margin-bottom: 10px;
    background: var(--colorHint);
    color: var(--colorWhite);
    border-radius: 3px;
    padding: 5px;
}

.block_item{
    cursor: pointer;
    margin-bottom: 5px;
    padding: 5px;
}

.block_item:hover{
    background: var(--colorSelect);
    border-radius: 3px;
}

.block_item_name{
    color: var(--colorUrl);
}

.block_item_value{

}

.block_item_comment{
    color: var(--colorGreen);
}

.person_connects_item{
    cursor: pointer;
    margin-bottom: 5px;
    padding: 5px;
    display: inline-flex;
    align-items: center;
}

.person_connects_item:hover{
    background: var(--colorSelect);
    border-radius: 3px;
}

.person_connect_person{

}

.person_connect_type{
    color: var(--colorBtnOk);
    margin-left: 10px;
    margin-right: 10px;
}

.person_connect_info{
    display: flex;
    align-items: center;
}

.person_info_item{
    display: grid;
    cursor: pointer;
    margin-bottom: 5px;
    padding: 5px;
}

.person_info_item:hover{
    background: var(--colorSelect);
    border-radius: 3px;
}

.person_info_date{
    color: var(--colorBtnOk);
}

.person_info_comment{
    margin-top: 5px;
}

.person_info_info{
    display: flex;
    align-items: center;
}

.person_info_file{
    color: var(--colorGreen);
}

.card_container{
    /* margin: 40px 0; */

}

.person_container{

}

.person_primary{
    display: grid;
}

.person_primary_date{
    margin-top: 5px;
}

.person_primary_id{
    margin-top: 5px;
}

.model_comand{
    cursor: pointer;
    display: grid;
    margin-left: 5px;
    padding: 5px;
    border-radius: var(--borderRadius);
    position: relative;
    align-items: center;

}

.model_comand .model_comand_text {
    visibility: hidden;
    background-color: black;
    color: var(--colorWhite);
    text-align: center;
    padding: 5px 10px;
    border-radius: 3px;
    position: absolute;
    z-index: 1;
    top: 110%;
    right: 0;
}

.model_comand:hover{
    background: var(--colorWhite);
    border-radius: 5px;
}

.model_comand:hover .model_comand_text {
    visibility: visible;
    background: var(--colorHead);

}

.model_comand_icon{
    width: 20px;
    height: 20px;
    margin-left: auto;
    margin-right: auto;
}

.model_comand_text{
    font-size: 12px;
}

.difference_container{
    display: inline-flex;
    width: 100%;
}

.difference_container_left{

}

.difference_container_right{

}

.difference_container_items{

}

.difference_container_head{
    font-weight: 600;
    padding: 5px;
}

.difference_item_container{

}

.difference_item{

}

.text_field_input{
    font-size: 14px;
    text-align: start;
    border-style: none;
    width: 100%;
    /* margin-left: 10px; */
    padding: 5px 0px 5px 10px;
    border-radius: 10px;

}



.integer_field{
    font-size: 14px;
    border-color: #eeeeee;
    border-radius: 10px;
    border-style: solid;
    border-width: 1px;
    text-align: start;
    padding: 5px;
    width: 70%;
    margin-left: 10px;

}

.integer_field_container{
    padding: 5px;
    display: flex;

}

.integer_field_container:hover{
    background: #eeeeee;
    border-radius: 15px;

}

.integer_field_head{
    font-size: 14px;
    color: var(--colorHead);
    /* margin-right: auto; */
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;

}

.boolean_field{
    cursor: pointer;
    background-color: black;
    transform: scale(1.4);

}

.boolean_field_text{
    cursor: pointer;
    color: var(--colorText);
    font-size: 14px;
    /* margin-right: 10px; */

}

.boolean_field_container{
    cursor: pointer;
    padding: 5px 10px;
    display: block;
    border-radius: 10px;
    /* flex-direction: row; */
    align-items: center;

}

.boolean_field_container:hover{
    background: #eeeeee;
    /* border-radius: 3px; */

}

.binary_field_image_container{
    padding: 5px;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    /* align-items: center; */
    justify-items: start;

}

.binary_field_video_container{
    padding: 5px;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    /* align-items: center; */
    justify-items: start;

}

.binary_field_audio_container{
    padding: 5px;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    /* align-items: center; */
    justify-items: start;

}

.binary_field_image_prev{
    width: 100%;
    max-width: 300px;
    border-radius: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: #eeeeee;

}

.binary_field_image_edit_btn{
    width: 15px;
    height: 15px;
    padding: 10px;

}

.binary_field_image_edit_input{
    display: none;

}

.binary_field_image_container_edit{
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    background: #ff4f4f;
    position: absolute;
    right: 10px;
    top: 10px;

}

.binary_field_image_container_head{
    position: relative;
    width: 100%;
    margin-top: 10px;

}

.binary_field_image_container_bottom{
    display: flex;
    align-items: center;

}

.binary_field_video_container_bottom{
    display: flex;
    align-items: center;

}

.binary_field_audio_container_bottom{
    display: flex;
    align-items: center;

}


.binary_field_container{
    padding: 5px;
    display: flex;
}

.binary_field_container:hover{
    background: #eeeeee;
    border-radius: 15px;

}

.binary_field_head{
    font-size: 14px;
    color: var(--colorHead);
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
}

.binary_song_btn_text{
    font-size: 12px;
}

.binary_song_icon{
    width: 20px;
    height: 20px;
    margin-left: auto;
    margin-right: auto;
}

.binary_song_btn{
    cursor: pointer;
    display: grid;
    margin: 5px;
    padding: 5px;
    border-radius: var(--borderRadius);
}

.binary_song_btn:hover{
    background: var(--colorSelect);
    border-radius: 3px;
}

.binary_download_btn{
    padding: 5px;
    height: 20px;
    width: 20px;
    margin-left: 5px;
}

.binary_field_filename{
    /* margin-top: auto; */
    /* margin-bottom: auto; */
    /* margin-left: 10px; */

}

.binary_download_btn:hover{
    background: var(--colorWhite);
    border-radius: 3px;
}

.text_field_container{
    padding: 5px;
    display: flex;
    border-radius: 10px;
    align-items: center;

}

.text_field_container:hover{
    background: #eeeeee;
    border-radius: 15px;

}

.text_field_desc_container{
    padding: 5px;
    display: grid;
}

.text_field_desc_container:hover{
    background: var(--colorSelect);
    border-radius: 3px;
}

.text_field_head{
    font-size: 14px;
    color: var(--colorHead);
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;

}

.text_field{
    font-size: 14px;
    border-color: #eeeeee;
    border-radius: 10px;
    border-style: solid;
    border-width: 1px;
    text-align: start;
    padding: 5px;
    width: 70%;
    margin-left: 10px;

}

.text_field_desc{
    font-size: 14px;
    border-color: #D9D9DE;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    text-align: start;
    padding: 5px;
    margin: 0;
    margin-top: 5px;
    min-height: 90px;

}

.model_field_container{
    padding: 5px;
    display: flex;
    border-radius: 15px;

}

.model_field_container:hover{
    background: #eeeeee;
    /* border-radius: 3px; */

}

.model_field_head{
    font-size: 14px;
    color: var(--colorHead);
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;

}

.model_field{
    font-size: 14px;
    border-radius: var(--borderRadius);
    border-style: solid;
    border-width: 1px;
    text-align: start;
    padding: 5px;
    width: 70%;
    height: fit-content;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 10px;
    background: var(--colorGold);
    margin-left: 10px;

}

.model_field_input_container{
    border-color: #eeeeee;
    background: white;
    border-radius: 10px;
    border-style: solid;
    border-width: 1px;
    display: flex;
    align-items: center;
    position: relative;
    flex: 1;
    margin-left: 5px;

}
