:root {
/* Light */ 
    --mmtainLightEditableBackground : #FFF;
    --mmtainLightCellBorder : #d9d9d9;;
    --mmtainLightSelectedEditableBackground: #e0f3cc; 
    --mmtainLightSelectedLockedBackground: #c4df9a;   
    --mmtainLightHeaderSelected: #a3c46b;       
    
/* Dark */
    --mmtainDarkEditableBackground : #000;
    --mmtainDarkCellBorder : #5c5c5c;;
    --mmtainDarkSelectedEditableBackground: #476626;   
    --mmtainDarkSelectedLockedBackground: #36511e;     
    --mmtainDarkHeaderSelected: #2a4018;     

/* Used*/
    --mmtainEditableBackGround: var(--mmtainLightEditableBackground);
    --mmtainCellBorder: var(--mmtainLightCellBorder);
    --mmtainSelectedEditableBackground : var(--mmtainLightSelectedEditableBackground);
    --mmtainSelectedLockedBackground : var(--mmtainLightSelectedLockedBackground);
    --mmtainHeaderSelected : var(--mmtainLightHeaderSelected);

}

.massMaitainTable {
    border-collapse: separate;
    border-spacing: 0;
    overflow:scroll;
    color: var(--foreColor1);
    font-size: small;
}

.massMaitainTable th,
.massMaitainTable td{
    border-spacing: 0;
    text-align: left;
    padding: 5px;
}

.massMaitainTable th{
    background-color: var(--backgroundHeader);
    border-bottom: 1px solid var(--mmtainCellBorder);
    border-right: 1px solid var(--mmtainCellBorder);
    position: sticky;
    top: 0; 
}

.massMaintainDataChanged{
    background-image: url("../images/ic_action_edit_dark.png");
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-size: 16px;    
}

.massMaitainTable .lockedColumn{
    background-color: var(--backgroundHeader);
    border-bottom: 1px solid var(--mmtainCellBorder);
    border-right: 1px solid var(--mmtainCellBorder);
    min-width: 20px;
}

.massMaitainTable .stickyColumn{
    position: sticky;
    left: 0px;
    z-index :1000;
}

/*.massMaitainTable td:focus-visible {
    outline: 1px solid var(--lightInputBorderColor);;
}*/

.massMaitainTable .selected[contenteditable='true']{
    background-color: var(--mmtainSelectedEditableBackground) !important;
}

.massMaitainTable .selected[contenteditable='false']{
    background-color: var(--mmtainSelectedLockedBackground) !important;
}

.massMaitainTable .hideTextSelection::selection{
    background: transparent;
}


.massMaitainTable .selectedLock{
    background-color: var(--mmtainHeaderSelected);
}


.massMaitainTable td{
    border-bottom: 1px solid var(--mmtainCellBorder);
    border-right: 1px solid var(--mmtainCellBorder);
}

.massMaitainTable td[contenteditable='true']{
    background-color: var(--mmtainEditableBackGround);
}

.massMaitainTable td[contenteditable='false']{
    background-color: var(--backgroundHeader);
}

.massMaitainTable .statusImage{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.cellVisible{
    display: table-cell;
}

.cellHidden{
    display: none;
}


.massMaintainPage section{
    overflow: scroll !important;
}