:root {
    --selectionBgColor: #FED01C;
    --selectionColor: #000;
    --reportIconPath: url("../icons/lightTheme/ReportIcon.svg");
    --imagesIconPath: url("../icons/lightTheme/ImagesIcon.svg");
    --downloadIconPath: url("../icons/lightTheme/DownloadIcon.svg");
    --shareIconPath: url("../icons/lightTheme/ShareIcon.svg");
    --uploadIconPath: url("../icons/lightTheme/UploadIcon.svg");
    --logoPth: url("../image/logo-black.svg");
    --logoutBackground: #f9f9f9;
    --themeIconPath: url("../icons/lightTheme/themechangeIcon.svg");
    --popupBackground: #ffff;
    --popUp_bg_color: #ffff;
    --crossButtonColor: #545D6A;
    --textColor1: #ffff;
    --textColor2: #212429;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: var(--grayText);
    opacity: 1; /* Firefox */
    font-size: 13px;
    font-family: circularstd-thin;
}

body{
    color: #0D0D0D;
    background: #F1F1F1;
}

.topbar-container {
    background: #F0F2F5;
}

/******************** START PANEL CSS ************************/
.panel{
    background: #fff;
}
.panel-head {
    background: #fff;
    border-bottom: 1px solid #F0F2F5;
}
.panel-body{
    background: #FFF;
    color: #212429;
}
.panel-body thead tr{
    background: #fff;
}

.panel-body tr th a{
    color: #A3AEBF;
}
.panel-body tr th a.active {
    color: #0066FF;
}
.panel-body tr th a:hover, .panel-body tr th a.active:hover{
    color: #212429;
}
/******************** END PANEL CSS ************************/

/******************** START TABLE CSS ************************/
tr{
    border-bottom: 1px solid #F0F2F5;
}
tr:hover{
    background-color: #fff;
}
th{
    color: #A3AEBF;
}
th:hover{
    color: #0066FF;
}
td{
    color: #212429;
}
.datatable .thead:hover{
    background: #FFF;
}


.datatable .active td{
    color: #263142;
}
.datatable .active:hover{
    color: #212429;
}


.datatable .datatr:hover svg{
    fill: #0D0D0D;
}

.datatable .datatr.active svg{
    fill: #0D0D0D;
}

ul li{
    color: #222529;
    border-bottom: 2px solid #F0F2F5;
}
ul li a{
    color: #8D97A6;
    border-bottom: 2px solid #F0F2F5;
}
ul li a:hover{
    border-bottom: 2px solid #0066FF;
    color: #222529;
}
ul li .active{
    border-bottom: 2px solid #0066FF;
    color: #222529;
}
/******************** END TABLE CSS ************************/

/******************** START RIGHT MENU CSS ************************/
.right_menu .blue-line{
    background: #0066FF;
    color: #fff;
}
.right_menu .blue-line td{
    color: #fff;
}
.green-btn{
    background: #32B112;
    border-radius: 6px;
    color: #fff;
}
.blue-btn{
    background: #1960E4;
    color: #fff;
}
.white-btn{
    background: #fff;
    color: #222529;
}
/******************** END RIGHT MENU CSS ************************/

/******************** START MESSAGE CSS ************************/
#message .panel-heading{
    border-bottom: 1px solid #F0F2F5;
}
#message .panel-title{
    color: #212429;
}
#message .panel-body{
    border-bottom: 1px solid #F0F2F5;
}
#message .sender .metatext{
    color: rgba(255, 255, 255, 0.45);
}
#message .sender .msg{
    background: #F5F7FA;
    color: #222529;
}
#message .reciver .metatext{
    color: rgba(255, 255, 255, 0.45);
}
#message .reciver .msg{
    background: #0066FF;
    color: #fff;
}
#message .devider{
    border-bottom: 1px dashed #F0F2F5;
}
#message .date{
    background: #EBEDF0;
    color: #A3AEBF;
}
#message .comment-text-box{
    border: 1px solid #F0F2F5;
    background: #fff;
    color: #A3AEBF;
}
#message .post-btn{
    color: #0066FF;
    background: #fff;
}
#message .post-btn:hover{
    color: #212429;
    background: #ededed;
}
/******************** END MESSAGE CSS ************************/

/******************** START HISTORY CSS ************************/
#history .panel-head {
    background: #fff;
    border-bottom: 1px solid #F0F2F5;
}
#history .panel-head .title{
    color: #222529;
}

#history .postdata tr td a{
    color: #222529;
}

#history .postdata tr:hover{
    background: #ededed;
    border-radius: 0px;
}
/******************** END HISTORY CSS ************************/

/******************** START USERS CSS ************************/
#users .panel-head {
    background: #fff;
    border-bottom: 1px solid #F0F2F5;
}
#users .panel-head .title{
    color: #222529;
}
#users .panel-head::after {
    background: url(../image/arrow_down_light.svg) no-repeat;
}
#users .postdata tr td a{
    color: #222529;
}

#users .postdata tr:hover{
    background: #ededed;
    border-radius: 0px;
}
/******************** END USERS CSS ************************/

.graytext{
    color: #FFFFFF;
}

.yellowtext{
    color: #FFA800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-size: 11px;
    line-height: 13px;
}


table.postdata tr td:nth-child(3){
    color: #8D97A6;
}


.toolbar-container {
    background: #FFFFFF;
}

.blazorInput {
    border: 1px solid #F0F2F5;
    color: #A3AEBF;
}

.popup_inputs {
    background: #F9FBFF;
    border: 1px solid #F9FBFF;
}

.searchBtn {
    border: 1px solid rgb(244, 233, 233);
}

.underlineLinkBtn {
    color:black;
}

.logoutDropdown {
    content: url(../image/arrow_down_logout_light.svg);
}

.circleCharater {
    background-color: #0066FF;
}

.fieldInput_text {
    color: #222529;
}

label {
    color: #A3AEBF;
}

.advancedSearch_button {
    background: linear-gradient(81.81deg, #263142 0%, #545D6A 100%);
}

.QubsIcon {
    color: var(--textColor2);
}