/* modal window */

.dv-modal {
    
    position: fixed;
    left: 0;
    top: 0;
    z-index: 20000;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.6);
    justify-content: center;
    align-items: center;
}

.dv-modal_white {

    position: fixed;
    left: 0;
    top: 0;
    z-index: 20000;
    width: 100vw;
    height: 100vh;
    background: none;
    justify-content: center;
    align-items: center;
  
}


/*.dv-modal-block {*/
/*    position: relative;*/
/*    background: white;*/
/*    color: #1c303E;*/
/*    padding: 60px;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*}*/
.dv-modal-block{
    position: relative;
    width: 555px;
    padding: 33px 16px 16px 16px;
    background: #fff;
    color: #3c3c3c;
    box-shadow: 0 0 0 6px rgb(153 153 153 / 30%);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.dv-modal-block-wide{
    position: relative;
    width: 800px;
    padding: 33px 16px 16px 16px;
    background: #fff;
    color: #3c3c3c;
    box-shadow: 0 0 0 6px rgb(153 153 153 / 30%);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.cross-modal {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
   
}

.bottom-right{

    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 30px;
  
    justify-content: center;
    align-items: center;

}

.cross-modal:hover, .bottom-right:hover{

    cursor:pointer;

}
.cross-modal svg{

    fill:#808080;

}

.dv-modal-title-row {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
    font-size: 25px;
    color: #222;
    font-weight: 500;
    line-height: 1.5;
}

.dv-modal-title {

    display: flex;
    justify-content: center;
   
    font-size: 25px;
    color: #222;
    font-weight: 500;
    line-height: 1.5;
}

/*     input select            */

.is-wrapper{

    display: flex;
    justify-content: center;
    align-items: center;

    position:relative;

    border: 1px solid #dddddd;
    border-radius: 4px;
    margin-right:5px; 

}


.is-input {

    display: flex;
    justify-content: flex-start;
    align-items: center;

    width:calc(100% - 40px);
    height:100%;


    position:absolute;
    left:0;
    top:0;


    margin-right:5px;
    padding-left: 5px;

}

.is-right-chevron{

    display: flex;
    justify-content: center;
    align-items: center;

    position:absolute;
    right:0;
    top:0;

    width:40px;
    height:100%;

    border-left:1px solid #dddddd;


}
.is-right-chevron:hover, .is-drop-row:hover, .choice-id-title:hover, .plus:hover {

    cursor:pointer;


}
.is-drop{


    flex-direction:column;

    position:absolute;
    left:-2px;
    

    width: calc(100% + 4px);
    
    border-bottom: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    border-radius: 0 0 4px 4px;

    background-color:#ffffff;
    z-index:10;

}

.is-drop-row{


    display: flex;
    justify-content: flex-start;
    align-items: center;

    padding-left: 5px;

}

.choice-id-drop {

    position:absolute;
    top:40px;
    left:0;
    background:white;
    z-index: 10;

}

.choice-id-drop-select {

    position:absolute;
   
    left:0;
    background:white;
    z-index: 201;

}

.choice-id-row{

    
}


/*--btn edit--drop--------*/

.btn-edit-drop{

    position:absolute;
  
    right:0;

    width:450px;
    background: var(--grey);

    border:1px solid #dddddd;
    border-radius: 4px;
    z-index: 100;

}

.btn-action-drop{

    position:absolute;
  
    left:0;

    width:450px;
    background: var(--grey);

    border:1px solid #dddddd;
    border-radius: 4px;
    z-index: 100;

}


.edit-drop-up{

    bottom:34px;

}

.edit-drop-down{

    top:35px;
}

.btn-edit-row-drop{

    flex-direction: column;

    position:absolute;
    top:30px;
    left:0;
    width:100%;
    height:100px;
    background:#e5e5e5;


}



.btn-edit-row, .btn-separator-row{

    display:flex;
    justify-content: flex-start;
    align-items: center;

    width:100%;
    height:30px;
    
    padding-left: 10px;

}

.btn-edit-row:hover{

    cursor:pointer;
    background: #d3d3d3d3;
    border-top:1px solid #a9a9a9a9;
    border-bottom:1px solid #a9a9a9a9;


}

.grey-circle svg{

    fill:#a9a9a9a9;
}

.green-circle svg{

    fill:#64991e;
}