:root {
    --blue:#4480C1;
    --lightblue: #BADBFF;
    --white: #ffffff;
    --red: #ff0000;
    --redlight:#f4abab;
    --green_txt:#00b737;
    --black1: #353535;
    --black2: #656565;
    --grayf5:#f5f5f5;
    --graye5:#e5e5e5;
    --graya5:#A5A5A5;
    --smalltext:12px;
    --radius5:5px;
    --radius8:8px;
    --radius10:10px;
    --bs-font-sans-serif:"Lato", sans-serif;
}
.white_txt{
    color: var(--white);
}
.red_txt {
    color: var(--red)!important;
}
.blue_txt_dark {
    color: var(--blue)!important;
}
.blue_txt {
    color: var(--lightblue)!important;
}
.black_txt{
    color:  var(--black1);
}
.green_txt{
    color: var(--green_txt)!important;
}
.graya5{
    color: var(--graya5);
}
.black_bg{
    background-color:  var(--black1);
}
.white_bg{
    background-color: var(--white);
}
.border-box{
    border: 1px solid var(--lightblue);
    border-radius: 5px;
    padding: 5px;
}
.border-bg-box{
    background-color: var(--grayf5);
    border: 1px solid var(--lightblue);
    border-radius: 5px;
    padding: 5px;
}
.red_border{
    border: var(--red);
}
.anchor_tag{
    color: var(--blue);
}
.anchor_tag:hover{
    color: var(--lightblue);
}
.error_txt_popup{
    color: var(--red);
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    padding: 5px; 
}
.error_txt{
    font-size: 10px;
    color: var(--red);
}
.success_txt{
    font-size: 14px;
    color: var(--green_txt);
    text-align: center;
    text-shadow: 1px 1px 3px #97c9ff;
    font-weight: bold;
}
.throwerror_txt, .alert_txt,.fileerror_txt{
    font-size: 14px;
    color: var(--red);
    text-align: center;
    text-shadow: 1px 1px 3px #97c9ff;
    font-weight: bold;
}
.f-10{
    font-size: 10px;
}
.f-12{
    font-size: 12px;
}
.f-13{
    font-size: 12px;
}
.f-14{
    font-size: 14px;
}
.f-15{
    font-size: 15px;
}
.f-16{
    font-size: 16px;
}
.h-77{
    height: 77%;
}
.bold-4{ font-weight: 400;}
.bold-5{ font-weight: 500;}
.bold-6{ font-weight: 600;}
.z-1{
    z-index: 99999;
}

.title_text{
    font-size: 18px;
    font-weight: 600;
}

.title_text_sub{
    font-size: 16px;
    font-weight: 400;
}
.w-otp{width: 40px!important; text-align: center;}
/*---------------*/
body,
html {
    margin: 0;
    padding: 0;
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: normal;
    color:  var(--black1);
}

.body_wrap {
    background-color: var(--black1);
    width: 100%;
}
.body_wrap_in{
    /* height: calc(100vh - 100px); */
    height: 100%;
    overflow: auto; 
}
.login_wrap {
    width: 100%;
    background-color: var(--lightblue);
    height: calc(100vh - 100px);
}
.login_wrap_in{
    margin:10% auto;
    height: 100%;
}
.login_wrap_in .form-label{
    font-size: var(--smalltext);
    font-weight: bold;
    color: var(--black1);
}

.search_wrap{
    position: relative;
    width: 60%;
}
.search_wrap input{ height: 40px;}
.search_wrap .btn_search{
    position: absolute;
    right: 10px;
}
.user_wrap .fa:hover{
    color: var(--blue);
}
.left_sidebar{
    background-color: var(--blue);
    padding: 15px;
    width: 20%;
    display: flex;
    flex: 0 0 auto;
    position: relative;
    transition: all ease 0.3s;
}
.left_sidebar .btn-normal a, .left_sidebar .btn-normal{
    display: block;
    text-align: left; 
    width: -webkit-fill-available;
    color: var(--white);
}
.left_sidebar .btn-toggle-nav a, .left_sidebar .btn-toggle{
    display: block;
    text-align: left; 
    width: -webkit-fill-available;
    color: var(--white);
}
.left_sidebar .btn-toggle::before{
    color: var(--white);
    fill: var(--white);
}
.left_sidebar .btn:hover{
    color: var(--black1);
}
.list-unstyled li{
    border-bottom: 1px dashed var(--white);
}
.btn-toggle-nav li:last-child{
    border-bottom: none;
}
.list-unstyled li .fa{
    font-size: 13px;
    margin-right: 10px;
}
.list-unstyled ul>li:hover a{
    color: var(--black);
}
.collapse_btn, .collapsed_btn{
    width: 20px;
    height: 20px;
    background-color: var(--blue);
    color: var(--white);
    border: 1px solid var(--white); 
    border-radius: 100%;
    vertical-align: middle;
    position: absolute;
    right: -6px;
    top: 0px;
    line-height: 0;
}
.fa-sm{
    font-size: 11px; 
}
.menu_txt{
    font-size: 13px;
}
.menu_txt_hide{
    display: none;
}
.right_sidebar{
    width: 80%;
    flex: 0 0 auto;
    transition: all ease 0.3s;
}
.left_sidebar_sm{
    width: 70px;
}
.right_sidebar_sm{
    width: calc(100vw - 90px);
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
    color: var(--blue)!important;
    border: 0;
    border-bottom: 2px solid var(--blue);
}
.nav-tabs .nav-item .nav-link{
    color: var(--black1);
    font-size: 14px;
}
.nav-tabs .nav-item .nav-link:hover{
    background-color: var(--lightblue);
}

.fixed_label{
    position: absolute;
    right: 0;
    top: 0;
    font-size: 11px;
    background-color: var(--lightblue);
    padding: 2px 5px;
    border-radius: 2px;
}
.fixed_label.red{
    background-color: var(--redlight);
}
.action_btns{
    position: absolute;
    bottom: 15px;
    right: 15px;
}
/*--------dataTable------*/
.table_wraper{
    width: 100%;
    overflow: auto;
    padding: 0 0 15px 0;
}
table.table.dataTable, div.dt-container div.dt-length label, table.dataTable thead th, table.dataTable thead td, .dt-search, .dt-info{
    font-size: 12px;
}
table.dataTable thead th, table.dataTable thead td{
    text-wrap: nowrap;
}
.page-link {
    padding: 0.275rem 0.5rem;
    font-size: 12px;
}

/*------bootstrap------*/
.form-control, .form-select, .btn{
    border-radius: var(--radius5)!important;
    font-size: 13px!important;
}
.input-group{
    margin-bottom: 10px;
}
.input-group .form-label{
    color: var(--black2);
    width: 100%;
    font-size: 13px;
    margin-bottom: 2px;
}
.form-label-info{ color: var(--black1); font-weight: 600; font-size: 13px;}
.icon-group input.input-icon{
    border-right: 0;
    border-radius: 5px 0 0 5px!important
}
.input-group .input-group-icon{    
    background-color: transparent;
    border-left: none;
    border: 1px solid #ced4da;
    margin-left: -1px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding: 0.25rem 0.5rem;
    font-size: .875rem;
    border-radius: 0 5px 5px 0;
}

/*-----scroller--------*/
/* width */
::-webkit-scrollbar {
    width: 10px;
    height: 5px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: var(--lightblue);
   
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: var(--blue);
    
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: var(--black2);
  }