/* 
 btn_set_status_1   Переключить в неактивный 
 btn_set_status_2   Взять в работу
 btn_set_status_3   Закрыть
 btn_set_status_2a  Открыть

 Статусы:
 1 - Неактивен
 2 - В работе
 3 - Закрыт
 
 */

 .contractor__new_system__btn{
    border-radius: 3px;
    height: 20px;
    background-color: gold;
    padding: 0px 5px;
    font-size: 12px;
    /* color: white; */
    line-height: 16px;
    white-space: nowrap;
    border: 1px solid black;
    cursor: pointer;
    margin:2px;
 }

    .contractor__new_system__btn:hover{
        outline: 1px solid dodgerblue;
    }

.contractor__new_system__btn_set_status_2a{
    display:none;
}

    .contractor__new_system__btn_set_status_2a[data-current_status='3']{
        display:block;
    }

.contractor__new_system__btn_set_status_1{
    display:none;
}
    .contractor__new_system__btn_set_status_1[data-current_status='2']{
        display:block;
    }

.contractor__new_system__btn_set_status_2{
    display:none;
}

    .contractor__new_system__btn_set_status_2[data-current_status='1']{
        display:block;
    }



.contractor__new_system__btn_set_status_3{
    display:none;
}

    .contractor__new_system__btn_set_status_3[data-current_status='2']{
        display:block;
    }



    
    
    
    .documentListHeader{
        padding: 0px 5px 2px 5px;
        color: gray;
        /* font-weight: 600; */
        font-size: 15px;
        border-bottom: 1px solid #b5b3b3;
        font-variant: petite-caps;
        font-variant: all-petite-caps;
        display: flex;flex-direction: row;
        height: 28px;
        align-items: flex-end;
    }

    
    
    .documentListContainer {
        padding-top:5px;padding-left:10px;padding-bottom:20px;
    }
    
    
    
    .documentListContainer div{
        margin-top: 5px;
        margin-right: 5px;
        background-color: #1a7396;
        color: white;
        padding: 2px 7px;
        white-space: normal;
        cursor: pointer;
        border-radius: 4px;
    }
    
    .documentListContainer div.noType{
        background-color: transparent;
        border: 2px solid #62798e;
         /* #6c757d; */
        color: #62798e;
    }
    
    .documentListContainer div.expire{
        border: 2px solid red;
   
    }
    
    
    
    .documentListContainer div:hover{
      /* outline: 2px solid dodgerblue; */
      opacity: 0.8;
    }
    
    .documentListContainer div.active{
        /* outline: 2px solid dodgerblue; */
        margin-left: -5px;
        opacity: 0.6;
      }
    
    .documentListContainer.mandatory div{
        background-color: #dc3545;
        color: white;
    }
    .documentListContainer.mandatory div[data-approve="true"]{
        background-color: #28a745;
    }

    .documentListContainer.mandatory > i{
        margin-right: 2px;
    }
   
    
    
    .documentListContainer.special div{
        background-color: #e06218;
        color: white;
    }
    .documentListContainer.special div[data-approve="true"]{
        background-color: #28a745;
    }

    .documentListContainer.special > i{
        margin-right: 2px;
    }
    
    
    #document_files div {
                        display: flex;
                        flex-direction: row;
                        max-width: 250px;
                        padding: 1px 5px;
                        justify-content: space-between;
                        border-radius: 4px;
                        background-color: #17a2b8;
                        color: white;
                        margin-top:2px;
                        font-weight: 100;
                        cursor:pointer;
        
    }

    #document_files div:hover{
        background-color: #0d6572;
     }
    
     #document_files div.active{
        margin-left: -10px;
     }
     
    
    
    #document_files  .document_file_actions i{
        color:white;
    }
    
    #document_files  .document_file_actions i:hover{
        color:#d6d6d6;
    }
     
    #document_files  .filename{
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    
    
    
    #leftpane{
        display:flex;
        flex-direction: column; 
        width:50%;
        overflow: overlay;
        padding:5px;
        padding-right:20px;
    }

    #previewPane{
        display:none;
        flex-direction: column; 
        flex-grow: 2;
        padding:10px;
        
        margin-top: 10px;
        box-shadow: 0px 0px 6px 0px #969696;
    }
    
    #previewPane.highlightDragDrop,
    #leftpane.highlightDragDrop{
        cursor: grab;
        box-shadow: 0px 0px 11px 0px #3e3e3e;
        background-color: aliceblue;
    }
    

    
    
    #previewPane .docfile{
        width: 0.1px;
        height: 0.1px;
        opacity: 0;
        overflow: hidden;
        position: absolute;
        z-index: -1;
    
    }
    
  
    .contractfile{
        width: 0.1px;
        height: 0.1px;
        opacity: 0;
        overflow: hidden;
        position: absolute;
        z-index: -1;
    
    }
    /*   
    #contract_files div {
        display: flex;
        flex-direction: row;
        max-width: 250px;
        padding: 1px 5px;
        justify-content: space-between;
        border-radius: 4px;
        background-color: #17a2b8;
        color: white;
        margin-top:2px;
        font-weight: 100;

    }   
    
#contract_files  .contract_file_actions i{
color:white;
}

#contract_files  .contract_file_actions i:hover{
color:#d6d6d6;
}

#contract_files  .filename{
overflow: hidden;
text-overflow: ellipsis;
}
    
     */
    
    
    
    
    
    
    
    
    
    
    
    .div_collapser_marker{
        display: flex;
        align-items: center;
        width: 14px;
        margin-bottom: 1px;
    }

    .div_collapser_marker:hover{
       color: black;
    }

    
    .contractorAdditionalTab{
             
        display:flex;
        flex-direction: row;
        margin-bottom: 2px;
        padding: 2px 7px;
       
        font-size: 13px;
        color: #272727;
        
        /* width: 125px; */
        overflow: hidden;
        text-overflow: ellipsis;
        background-color: #efefef;
        padding-right: 15px;
        
    }

    .contractorAdditionalTab:hover {
        box-shadow: -4px 0px lightgrey;
        background-color: #f8f8f8;
       
   }
    
    .contractorAdditionalTab.active {
         /* border: 1px solid lightgray; */
        /* border-left: 4px solid #0f7faf;
        box-shadow: 0px 0px lightgrey; */
        box-shadow: -4px 0px #0f7faf;
        text-shadow: -0.03ex 0 black, 0.03ex 0 black;
        
        
    }
    
    div[data-tab-id]{
        flex-grow: 1;
        width: 1px;
        overflow: auto;
    }

    
    
    
    .ascInput2 {
        flex-grow:2;
        
    }
    
    .ascInput2 input,
    .ascInput2 textarea {
    outline: none;
    height: 23px;
    /* min-width: 200px; */
    max-width: 100%;
    padding: 2px 6px 1px;
    border: solid #afbac1;
    border-width: 1px;
    /* background: #f7f7f7; */
    color: #020202;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
    font-size: 13px;
    font-weight: 600;
    border-radius: 4px !important;
    }
    
    .ascInput2 input:focus {
        border-color: dodgerblue;
        -webkit-box-shadow: inset 1px 0px 300px 200px rgba(123,219,187,0.33);
        -moz-box-shadow: inset 1px 0px 300px 200px rgba(123,219,187,0.33);
        box-shadow: inset 1px 0px 300px 200px rgba(123,219,187,0.33);
    }

    .headerDivInAscInput2{
        color: gray;
        font-weight: 100;
        line-height: 15px;
        font-size: 12px;
        text-align: left;
        
       
        
    }
    
    
    .divInAscInput2{
        width: 100%;
        height: 25px;
        border-bottom: 1px solid lightgray;
        padding: 5px;
        margin-left: 5px;
        margin-right: 5px;
        font-size: 14px !important;
        font-weight: 500;
    }
                                                             
    
    
    
    
    
    
    
    
    .simpleTabTabs > div{
        background-color:white;
        border:1px solid #efefef;
        padding:10px; 
        flex-grow:2;
        height: 100%;
        display: none;
        
        
                    background-color: white;
                    padding: 15px 20px;
                    padding-bottom: 100px;
                    border-radius: 4px;
                    border: 1px solid lightgrey;
                    
                    
    }
    
    
    .simpleHeader {
        font-size: 18px;
        font-weight: 300;
        border-bottom: 1px solid lightgray;
        line-height: 30px;
        margin-bottom:10px;
    }
    
    .simpleTabLinks div{
             
        display:flex;
        flex-direction: row;
        margin-bottom: 2px;
        padding: 2px 7px;
       
        font-size: 13px;
        color: #272727;
        
        width: 170px;
        overflow: hidden;
        text-overflow: ellipsis;
        background-color: #efefef;
        
    }

    .simpleTabLinks div:hover {
        box-shadow: -4px 0px lightgrey;
        background-color: #f8f8f8;
       
   }
   .simpleTabLinks div.nolink:hover{
    box-shadow: 0px 0px lightgrey;
    background-color: #efefef;
   }
   
   
   .simpleTabLinks div.active {
         /* border: 1px solid lightgray; */
        /* border-left: 4px solid #0f7faf;
        box-shadow: 0px 0px lightgrey; */
        box-shadow: -4px 0px #0f7faf;
        font-weight: 500;
        
        
    }

    .op02 {
        opacity:0.2
    }
    
    .op01 {
        opacity:0.1
    }
    
    
    .contractorTypeToggle {
        width: 95px;
        padding:3px;
        padding-left:5px;
        cursor: pointer;
        margin-right: 5px;
        background-color: #ffffffaa;
        border-bottom: 1px solid gainsboro;
    }
    
    .contractorTypeToggle:hover {
        color:white;
        background-color: #609ab3;
    }
    
    .contractorTypeToggle.active {
        
        color:white;
        
        background-color: #0f7faf;
    }
/* 
    .contractorTypeToggle.active:before {
        
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        content: "\f00c";
        
        width: 10px;
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        content: "\f00c";
        padding-left: 4px;
        padding-right: 4px;
        font-size: 10px;
        
    }
     */

    
    
    .yesNoToggle {
        width: 45px;
        padding: 2px;
        margin-top: 3px;
        padding-left:0px;
        cursor: pointer;
    margin-left: 10px;
    background-color: white;
        /* background-color: #ffffffaa;
        border-bottom: 1px solid gainsboro; */
    }
    
    .yesNoToggle:hover {
        color:white;
        background-color: #609ab3;
    }
    
    .yesNoToggle.active {
        
        color:white;
        padding-left:0px;
        background-color: #0f7faf;
    }
    
    .yesNoToggle.colored.green.active {
        
        background-color: #28a745;
    }
    
    .yesNoToggle.colored.red.active {
        
        background-color: #dc3545;
    }
    
    
    
    
    
    .yesNoToggle:before {
        
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        content: "\f00c";
        
        width: 10px;
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        content: "\f111";
        padding-left: 4px;
        padding-right: 4px;
        font-size: 10px;
        
    }

    .yesNoToggle.active:before {
        
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        content: "\f00c";
        
        width: 10px;
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        content: "\f192";
        padding-left: 4px;
        padding-right: 4px;
        font-size: 10px;
        
    }
    
    
    
    .CommentBlockFieldsContainer{
        padding:5px;
        padding-right: 5px;
    }
    
    .CommentBlockBodyContainer{
        padding-top:4px;
    }
    #CommentBlockContainer #records{
        display: flex;
        flex-direction: column;
    }
    
    .CommentBlockRecord{
        display: flex;
        flex-direction: row;
        
        padding:5px;
        box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
        border-radius: 3px;
        margin-bottom: 5px;
        /* max-width:800px; */
        width: 100%;
        /* min-height: 40px; */
        background-color: white;
        
        border-bottom: 1px solid lightgray;
        
    }
    
    
    .CommentBlockRecord.highlightDragDrop{
        cursor: grab;
        box-shadow: 0px 0px 11px 0px #3e3e3e;
        background-color: aliceblue;
    }
    
    
    
    .CommentBlockRecord .docfile{
        width: 0.1px;
        height: 0.1px;
        opacity: 0;
        overflow: hidden;
        position: absolute;
        z-index: -1;
    
    }
    
    
    .CommentBlockRecord #files {
        display: flex;
        flex-direction: row;
        margin-left: 5px;
        flex-wrap: wrap;
        padding-top: 3px;
    }
    
        .CommentBlockRecord #files div {
            display: flex;
            flex-direction: row;
            max-width: 100px;
            padding: 1px 5px;
            justify-content: space-between;
            border-radius: 2px;
            background-color: #17a2b8;
            color: white;
            margin-top: 2px;
            font-weight: 100;
            font-size: 11px;
            line-height: 14px;
            margin-right: 4px;

            }
            
            .CommentBlockRecord #files div:hover {
               
                /* background-color: #0d5f6b; */
    
                }
                
                .CommentBlockRecord #files  .document_file_actions{
                    padding-left:10px;
                }

            .CommentBlockRecord #files  .document_file_actions i{
            color:white;
            }

            .CommentBlockRecord #files  .document_file_actions i:hover{
            color:#d6d6d6;
            }

            .CommentBlockRecord #files  .filename{
            overflow: hidden;
            text-overflow: ellipsis;
            }


        
    

    .CommentBlockRecord .CommentText{
        padding-left: 4px;
        width: 100%;
        border: 0px;
        margin-top: 1px;
        min-height: 48px;
        /* max-height: 200px; */
        overflow: overlay;
        width: 0;
        flex-grow: 2;
        border-bottom: 1px solid lightgray;
    }
    
    
    
    
    
    
    
    [contenteditable=true]:empty:before {
        content: attr(placeholder);
        display: block; /* For Firefox */
        color:gray;
      }
    
      
    
      

    
    .CommentBlockRecord p {
        margin:0px;
    }
          
    .CommentBlockRecord .inputField::placeholder{
        color:transparent;
      }
    .CommentBlockRecord.active .inputField::placeholder{
        color:gray;
      }
    
    .CommentBlockRecord.active .inputField{ 
        outline: 1px solid dodgerblue;
    
    }
    
    
    .CommentBlockRecord .inputField{
        border:0px;
        width: 170px;
        margin-bottom: 5px;
        font-size: 12px;
        padding-left: 4px;
        outline-offset: 0px;
        /* background-color: #ececec; */
    }
    
    
    
    .CommentBlockRecord.active .note-editor
    {
        width: 0px;
        flex-grow: 2;
        overflow: overlay;
        min-height: 68px;
    }
    
        
    .CommentBlockBodyContainer{
        flex-grow:2;
    }
    
    
    textarea[resize="none"]{
        resize: none;
    }
    
    .tinyInput{
        border:0px;
        padding:0px;
        padding-left: 4px;
        margin-left:5px;
        margin-bottom:5px;
        font-size:12px;
        resize: none;
        width:160px;
        
    }

    .tinyInput.active{
      /*   border:1px solid dodgerblue; */
        background-color: rgb(248, 252, 255);
       
    }

    
    
    
    .ContractorAddContractsButton {
        font-size: 13px;
        display: block;
        background-color: white;
        padding: 2px;
        padding-bottom: 5px;
        margin-bottom: 8px;
        border-radius: 3px;
        border: 1px solid lightgray;
        cursor: pointer;
        width: 128px;
        line-height: 18px;
        /* padding-bottom: 4px; */
        margin-left: 5px;
        text-align: center;
        font-weight: 400;
    }
    
    .ContractorAddContractsButton:hover {
        background-color: #a7a7a7;
        border:1px solid #a7a7a7;
        color:white;
    }
    
    
    
    .fw600{
        font-weight:600;
    }

    
    
    
    .positionValuesContainer .headerDivInAscInput{
        display: none;
    }
    
    .positionValuesContainer.showUnits .headerDivInAscInput{
        display: table-row;
    }

    
    
    .positionValuesContainer .tolerance{
        display: table;
    }
    .positionValuesContainer.hideTolerance .tolerance{
        display: none;
    }
    
    .positionMarkup{
        display:flex; flex-direction:row;justify-content: space-between;
        padding: 5px; 
        
        border: 1px solid lightblue;
        border-bottom:0px;
        background-color: #fafdff;
    }
    .positionMarkup:focus-within {
        background-color: #f0f1f3;
    }


    
    
    .contractorBankAccountHeader{
       
    }
    
    
    .flex-column{
        display:flex !important;
        flex-direction:column;
    }   
     .flex-row{
        display:flex !important;
        flex-direction:row;
    }

    
    
    
    
    .checkListContainer {
        padding-top:5px;padding-left:10px;padding-bottom:20px;
    }
    
    
    
    .checkListContainer div{
        margin-top: 5px;
        margin-right: 5px;
        background-color: #1a7396;
        color: white;
        padding: 2px 7px;
        white-space: normal;
        cursor: pointer;
        border-radius: 4px;
    }
    
    .checkListContainer div.noType{
        background-color: transparent;
        border: 2px solid #62798e;
         /* #6c757d; */
        color: #62798e;
    }
    
    .checkListContainer div.expire{
        border: 2px solid red;
   
    }
    
    
    
    .checkListContainer div:hover{
      /* outline: 2px solid dodgerblue; */
      opacity: 0.8;
    }
    
    .checkListContainer div.active{
        /* outline: 2px solid dodgerblue; */
        margin-left: -5px;
        opacity: 0.6;
      }
    
    .checkListContainer.mandatory div{
        background-color: #dc3545;
        color: white;
    }
    .checkListContainer.mandatory div[data-approve="true"]{
        background-color: #28a745;
    }
    
    .checkListContainer.mandatory div[data-approve="neutral"]{
        background-color:    darkorange;
    }

    .checkListContainer.mandatory > i{
        margin-right: 2px;
    }