:root {
       --inventory-bg-color: rgba(0,0,0,.101961);
    }
    
    
.htmltable-grid { display: grid;  column-gap: 2px; row-gap: 2px;   align-items: center;}
.htmltable-head { background:#aaa; height:28px;  padding-left: 8px; padding-right: 8px; }

.head-bg-color {background:#888;}


.htmltable-head-body {height:100%; display:flex;  justify-content: flex-start; align-items: center; line-height:1;}
.htmltable-grid-head-content {height:100%; line-height:1; display: grid; column-gap: 0px;  align-items: center;}
 
.htmltable-row { height:100%;   background:#ccc; min-height:28px;  padding-left: 8px;   padding-right: 8px;  }
.htmltable-row-body {min-height:28px; display:flex;  justify-content: flex-start; align-items: center;}

.htmltable-selected-row {background:#b4c0cf /*b4c6c6*/ ; color:#000}
.htmltable-delete-row {background:#cfbbbb !important; color:#000}

.htmltable-chosen-row {background:#a1acc4/*c99e9d*/ !important; color:#fff !important; }
 
.htmltable-delete-column-head {background:#ba9898 !important;  }
.htmltable-delete-column-row {background:#d4baba !important;  }


.htmltable-filtered-row {background:#a1acc4 !important; color:#fff !important}
.htmltable-filtered-head {background:#99a3bb; color:#000}

.htmltable-edited-head {background:#90aaaa !important; color:#000}
.htmltable-edited-row {background:#b4c6c6 !important/*b4c0cf*/ ; color:#000}

.htmltable-source-create {background:#a1acc4; color:#FFF}

.htmltable-edited-dictionary { z-index:999; background:#888/*#859c9c*/; /*border-radius: 5px;*/  border:solid 0px #777/*#758585*/; 
                             color:#fff; min-width:max-content /*calc(100% + 40px)*/; min-height: 28px; 
                             padding:0px; /*padding-bottom:6px; */    left:calc(100% + 2px);}
.htmltable-dictionary-manual { width:100%; height:25px; border-bottom: solid 2px #e4e4e4; }

.htmltable-counter {  font-size: 11px;
    border-radius: 3px;
    color: #000;
    display: flex;
    align-items: center;
    padding-top: 1px;
    justify-content: center;
    text-align: center;
    width: 32px;
    height: 16px;
    line-height: 1;
    background: rgba(255,255,255,.7);}

.counter-edited { color: #fff; font-weight: 500 }

[shaddow-input] {color:#666; z-index:0}
/*
  head: 9da7b8
  row: bac4d1
*/

.maxw100 {max-width:50px !important;}


.htmltable-head-execute-icon {border-left:solid 2px #e4e4e4; /*margin-right:-6px; margin-left:6px;*/}
   
.grid-extra-value {display: grid; column-gap:7px; grid-template-columns: auto max-content; align-items: center}
.extra_box_value {    font-size: 12px;
    color: #000;
    display: flex;
    align-items: center;
    padding-right: 5px;
    justify-content: end;
    text-align: right;
    width: 41px;
    height: 18px;
    line-height: 1;
    background: rgba(255,255,255,.55);
    border-radius: 4px;}
   
.grid-unit-value {width:100%; display: grid; column-gap:5px; grid-template-columns: auto max-content; align-items: center}
.unit { color:#888}

.num-box-inv-green {    font-size: 1px;    width: 11px;    height: 12px;    line-height: 1;    background: #728274;   }
.num-box-inv-yellow {    font-size: 1px;    width: 11px;    height: 12px;    line-height: 1;    background: #8a7c76;   }
.num-box-inv-blue {    font-size: 1px;    width: 11px;    height: 12px;    line-height: 1;    background: #687c92;   }
.num-box-inv-red {    font-size: 1px;    width: 11px;    height: 12px;    line-height: 1;    background: #a37575;   }


.num-box-none {
    font-size: 1px;
    color: #000;
    display: flex;
    align-items: center;
    padding-top: 1px;
    justify-content: center;
    text-align: center;
    width: 14px;
    height: 12px;
    line-height: 1;
    background: var(--inventory-bg-color);
}
.num-box-none-wide {
    font-size: 1px;
    color: #000;
    display: flex;
    align-items: center;
    padding-top: 1px;
    justify-content: center;
    text-align: center;
    width: 11px;
    height: 12px;
    line-height: 1;
    background: var(--inventory-bg-color);
}

.num-box-inventory-none {
    font-size: 11px;
    color: #000;
    display: flex;
    align-items: center;
    padding-top: 1px;
    justify-content: center;
    text-align: center;
    width: 32px;
    height: 16px;
    line-height: 1;
    background: var(--inventory-bg-color);
        border-radius: 3px;
         
}
.num-box-inventory { border-radius: 3px;   font-size:11px; color:#000; display:flex;  align-items: center; padding-top:1px;
                 justify-content: center;  text-align:center; width:32px; height:16px; line-height:1;  background:rgba(255,255,255,.7) }

.num-box-inventory-empty { border-radius: 3px;   font-size:11px; color:#000; display:flex;  align-items: center; padding-top:1px;
                 justify-content: center;  text-align:center; width:32px; height:16px; line-height:1;  background:#c6c6c6 }


.num-box-average { border-radius: 3px;   font-size:11px; color:#fff; display:flex;  align-items: center; padding-top:1px;
                 justify-content: center;  text-align:center; width:32px; height:16px; line-height:1;  background:#6f7f9f }

.sellability-box-2 {    font-size:11px; color:#000; display:flex;  align-items: center; padding-top:1px;
                 justify-content: center;  text-align:center; width:5px; height:16px; line-height:1;  background:#6f7f9f }

.sellability-box-1 {    font-size:11px; color:#000; display:flex;  align-items: center; padding-top:1px;
                 justify-content: center;  text-align:center; width:5px; height:16px; line-height:1;  background:#a49b96  }

.sellability-box-0 { font-size:11px; color:#000; display:flex;  align-items: center; padding-top:1px;
                 justify-content: center;  text-align:center; width:5px; height:16px; line-height:1;  background:transparent }



.flex-center {justify-content: center}
.flex-end {justify-content: flex-end}


.htmltable-color-discret {color:#777 !important}
.htmltable-color-alert {color:#cc0000 !important}

.mr2 {margin-right:2px;}
.mr6 {margin-right:6px;}
.ml4 {margin-left:4px;}

.showmore-bg-gray2-head {background:#b4aba6 !important;}
.showmore-bg-gray2-row {background:#b4aba6 !important;}


.showmore-bg-gray-head {background:#aaa !important;}
.showmore-bg-gray-row {background:#c0c0c0;}

.showmore-bg-brown-head {background:#aea49c !important;}
.showmore-bg-brown-row {background:#c9bfb5 !important;}

.showmore-bg-green-head {background:#9fb3a6 !important;}
.showmore-bg-green-row {background:#bbc7bf !important;}

.showmore-bg-blue-head {background:#b4aba6 !important;} /*9fb0b5*/
.showmore-bg-blue-row {background:#c7c1bd  !important;} /*b6c7cc*/

.showmore-bg-blue2-head {background:#a7afc2 !important;}
.showmore-bg-blue2-row {background:#bdc4d4  !important;}

.showmore-bg-purple-head {background:#b8a4b8  !important;}
.showmore-bg-purple-row {background:#ccc0cc !important;}

.showmore-bg-gray-row2 {background:#d4cece;}

.row-chart_avg {display:grid; column-gap:8px; grid-template-columns:75px 32px; align-items: center}