/* DF 25 hotfix 
   Missing selector to apply material-icon fonts to some objects.  

*/

.WebColBtn button:before {
    font-family: "material-icons" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
}
.WebList .WebList_Body .WebList_Row button,
.WebGrid .WebList_Body .WebList_Row button { 
    padding: 0px 8px ; 
}
.WebColBtn button:before {
    margin-right: 8px;
}

/* hot-fix end */

.RedBox { border-width : 1px !important;
          border-color: red !important; }
          
.WebIcon_EditLine:before,
.WebIcon_EditLine button:before,
button.WebIcon_EditLine:before,
.WebIcon_EditLine>div>span.WebItm_Icon:before {
    /* Pencil over line Icon */
    content: "u";
}

.WebIcon_CloudDownload:before,
.WebIcon_CloudDownload button:before,
button.WebIcon_CloudDownload:before,
.WebIcon_CloudDownload>div>span.WebItm_Icon:before {
    /* Cloud download Icon */
    content: "e";
}

.WebIcon_CloudUpload:before,
.WebIcon_CloudUpload button:before,
button.WebIcon_CloudUpload:before,
.WebIcon_CloudUpload>div>span.WebItm_Icon:before {
    /* Cloud upload Icon */
    content: "m";
}

.WebIcon_CircleX:before,
.WebIcon_CircleX button:before,
button.WebIcon_CircleX:before,
.WebIcon_CircleX>div>span.WebItm_Icon:before {
    /* Circle X Icon */
    content: "X";
}

.WebIcon_ItemList:before,
.WebIcon_ItemList button:before,
button.WebIcon_ItemList:before,
.WebIcon_ItemList>div>span.WebItm_Icon:before {
    /* Item-List icon */
    content: "t";
}

.WebIcon_ItemListSquare:before,
.WebIcon_ItemListSquare button:before,
button.WebIcon_ItemListSquare:before,
.WebIcon_ItemListSquare>div>span.WebItm_Icon:before {
    /* Item-List inside square icon */
    content: "r";
}

.WebIcon_Categories:before,
.WebIcon_Categories button:before,
button.WebIcon_Categories:before,
.WebIcon_Categories>div>span.WebItm_Icon:before {
    /* matrix icon */
    content: "\ac";
}

.WebIcon_Person:before,
.WebIcon_Person button:before,
button.WebIcon_Person:before,
.WebIcon_Person>div>span.WebItm_Icon:before {
    /* Person icon */
    content: ")";
}

.WebIcon_ClipVertical:before,
.WebIcon_ClipVertical button:before,
button.WebIcon_ClipVertical:before,
.WebIcon_ClipVertical>div>span.WebItm_Icon:before {
    /* Paper Clip vertical icon */
    content: "g";
}

.WebIcon_Back:before,
.WebIcon_Back button:before,
button.WebIcon_Back:before,
.WebIcon_Back>div>span.WebItm_Icon:before {
    /* Back Arrow icon */
    content: "\e001";
    font-size: 20px;

}


/* File upload form */ 
.WebFileFrm.invalid_file .WebFile_Details {
    color: red ; 
}    


/* WebListExpandPanel */     
.WebGrid.SubList .WebList_Body .WebList_Row,
.WebList.SubList .WebList_Body .WebList_Row {
    background-color: var(--df-MainLight4);
}
.WebList.SubList > div > div > div > div > .WebList_Body.WebList_ShowSelected > .WebList_Row.WebList_Selected,
.WebGrid.SubList > div > div > div > div > .WebList_Body.WebList_ShowSelected > .WebList_Row.WebList_Selected,
.WebGrid.SubList > div > div > div > div > .WebList_Body.WebList_ShowSelected > div > div > .WebList_Row.WebList_Selected,
.WebList.SubList > div > div > div > div > .WebList_Body.WebList_ShowSelected > div > div > .WebList_Row.WebList_Selected{
    background-color: var(--df-MainLight3);
    border-left: 2px solid var(--df-MainLight);
}


/* Weblist Group Headers */ 

.WebList_GroupHeader {
    align-items: center; /* center child items vertically */ 
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    color: var(--df-Grayscale2);
    font-style: italic;
    font-weight: bold;
    font-variant: small-caps;
    font-size: 1.2em ; 
}

.WebList_GroupHeader.Web_Level0 {
    margin-top: unset; 
    padding: var(--df-MobListRowPadding);
    background-color: var(--df-MainLight2);
    /*background-color: unset ; */
}
.WebList_GroupHeader_ToggleBtn {
    color: unset;
    align-self: unset;
    font-size: 0.9em ; 
}    

  
.WebList_GroupHeader .WebList_GroupHeader_Items {
    align-self: unset;
    padding-right: 10px ; 
}

.WebList_GroupHeader_IconExpand:before {
    content: "\2b9e";
}

.WebList_GroupHeader_IconCollapse:before {
    content: "\2b9f";
}


.MobileList.WebList .WebList_Body .WebList_Row td.MainMelodyColumn,
.MobileList.WebGrid .WebList_Body .WebList_Row td.MainMelodyColumn {
    background-color: #ccccff;
}

.MobileList.WebList .WebList_Body .WebList_Row td.AlternateMelodyColumn,
.MobileList.WebGrid .WebList_Body .WebList_Row td.AlternateMelodyColumn {
    background-color: #ffcccc;
}

/* Tiles */ 

/* Material theme has no built-in colors for tiles */ 

.Df_Material .Tile.Light .WebCon_Sizer {
    background: var(--df-MainLight2);
    color: var(--df-Grayscale2);
}

.Df_Material .Tile.Light .Tile_Title,
.Df_Material .Tile.Light .Tile_Subtitle,
.Df_Material .Tile.Light .Tile_TextUnderIcon, 
.Df_Material .Tile.Light .Tile_Icon { 
    color: inherit ; 
}


.Df_Material .Tile.DarkMedium .WebCon_Sizer {
    background: var(--df-MainMedium);
    color: var(--df-Grayscale8);
}


.Df_Material .Tile.DarkMedium .Tile_Title,
.Df_Material .Tile.DarkMedium .Tile_Subtitle,
.Df_Material .Tile.DarkMedium .Tile_TextUnderIcon, 
.Df_Material .Tile.DarkMedium .Tile_Icon { 
    color: inherit ; 
}


.Df_Material .Tile.Dark .WebCon_Sizer {
    background: var(--df-MainRegular);
    color: var(--df-Grayscale8);
}

.Df_Material .Tile.Dark .Tile_Title,
.Df_Material .Tile.Dark .Tile_Subtitle,
.Df_Material .Tile.Dark .Tile_TextUnderIcon,
.Df_Material .Tile.Dark .Tile_Icon { 
    color: inherit ; 
}