/* ------------------------ */
* {
    box-sizing: border-box !important;
    direction: rtl;
}

.badge-pill {
    padding: 4px 6px !important;
    }
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
#eroorInput{
    font-size: 12px;
    transition:ease-in-out 0.3s;
}
#errorInput{
    top: 17px;
}
ul , li {
    list-style-type: none;
}
.margin-auto{
    margin: 0 auto !important;
}
@media (min-width: 600px){
    .modal-dialog {
        max-width: 600px !important;
    }
    .modal-dialog.col-12 {
        max-width: 2048px!important;
    }
} 
   .mobile-title{
    display: inline;
}
.infoInput {
    max-width: 50%;
    position: absolute !important;
    bottom: 1px;
    font-weight: bold;
    font-size: 13px;
}

.disoption[disabled]{
background-color: #f7f9fc !important;
}
.custom-select{
    max-width: 40%;
}
    .Userselect {
    min-width: 130px;
    margin-bottom: 0 !important;
}
a{
    text-decoration: none !important;
}
.col-1 {
    width: 8.33%;
}

.col-2 {
    width: 16.66%;
}

.col-3 {
    width: 25%;
}

.col-4 {
    width: 33.33%;
}

.col-5 {
    width: 41.66%;
}

.col-6 {
    width: 50%;
}

.col-7 {
    width: 58.33%;
}

.col-8 {
    width: 66.66%;
}

.col-9 {
    width: 75%;
}

.col-10 {
    width: 83.33%;
}

.col-11 {
    width: 91.66%;
}

.col-12 {
    width: 100%;
}

.text-center {
    text-align: center;
}

body {
    scrollbar-width: none;
    overflow-x: hidden;
 }
*::-webkit-scrollbar {
    display: none;
}
.dis-none{
    display: none;
}
.dis-none-important{
    display: none !important;
}
.modal-header .close {
    padding: 1rem 1rem;
    margin: -1rem !important;
    cursor: pointer;
}
p.count_all {
    font-size: 14px;
    padding: 10px;
    position: absolute;
    bottom: 100px;
}
.modal-header {
    flex-direction: row-reverse;
}
input , button{
border-radius: 5px;
}
@font-face {
    font-family: "IRANSansWeb";
    src: url("../Fonts/IRANSansWeb.woff") format("woff");
}
@font-face {
    font-family: "IRANSansEn";
    src: url("../Fonts/IRANSANS.woff") format("woff");
    font-weight: normal;
    font-style: normal;
  }
button{
    display: block;
}
body{
    background-color: #edf1f7 !important;
    height: 100%;
}

.overflowON {
    overflow: scroll;
}

.overflowOFF {
    overflow: hidden;
}

a, span, p, div {
    font-family: 'IRANSansWeb';
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'IRANSansWeb';
    margin: 0 !important;
}
.ENfont{
    font-family: 'IRANSansEn';
}

h1 {
    font-size: 2rem !important;
    font-weight: bold !important;
}

h2 {
    font-size: 16px;
    font-weight: 500;
}

h3 {
    font-size: 15px;
    font-weight: 500;
}

h4 {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
}

h5 {
    font-size: 13px;
    font-weight: 400;
}

h6 {
    font-weight: normal;
    font-size: 12px;
}

.white {
    color: #fff !important;
}
.bacwhite{
    background-color: #fff;
}

/*----- login-header --*/
#rowlogin{
    padding: 2.5rem;
}
#login {
    margin: 0 auto;
    min-height: 645px;
}
.login-header{
    padding: 15px 10px;
    border-bottom:1px solid #edf1f7;
}
.login-header p{
    margin: 0;
}
.login-header img{
    display: inline;
}
.sub-title{
    color: #1a2138;
    font-family: 'IRANSansWeb';
    font-size: 13px;
    font-weight: 400;
    line-height: 1.25rem;
}
#top-login{
    margin-bottom: 40px;
}
.login-body{
    padding: 12px;
    padding-bottom: 60px;
}
.label {
    color: #8f9bb3;
    font-family: 'IRANSansWeb';
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1rem;
    display: block;
    margin: 4px auto;
}
span.Edit_label {
    display: inherit;
    font-size: 12px;
    margin-bottom: 2px;
}
#login-form{
display: block;
margin: 0 auto;
}
#login-form span{
    text-align: right !important;
    font-size: 12px;
    float: right;
}

#captcha{
    width:120px;
    height: 48px;
    border-radius: 5px;
}

#captcha_form{
    margin-top: 15px;
    float: left;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-evenly;
}
#refresh_captcha{
    background-image: url(../img/refresh.png);
    background-size: contain;
    background-position: center;
    width: 35px;
    height: 48px;
    float: left !important;
    background-repeat: no-repeat;
    border-radius: 50px;
    margin:0 5px;
    cursor: pointer;
}
#refresh_captcha:focus{
box-shadow:0 0 5px 0 rgba(0,0,0,0.3);
}
/*----other forms ----*/

input , select , textarea{
    text-align: center;
    border:solid 1px rgba(0,0,0,0.1);
    outline: none;
    background-color: #f7f9fc !important;
    padding: 10px 5px;
    margin-bottom: 10px !important;
    transition: ease-in-out 0.2s;
    height: auto !important;
    border-radius: 5px;
}
textarea{
    font-size: 14px !important;
    min-height: 95px;
    min-width: 230px;
}

input:hover{
    border-color: #2EBD75;
    }
input:focus{
border:solid 1px #80bdff;
box-shadow: 0 0 5px 0px #80bdff;
}
input[type="number"]{
    direction: ltr;
}
.custom-select:focus {
    border-color: #80bdff;
}

select{
    min-width: 225px;
    background-color: #f7f9fc !important;
    font-size: 14px !important;
    text-align: center !important;
    text-align-last:center;
}
option{
    padding-right: 10px !important;
}
.labelSelect{
    margin-left:20px ;
    margin-top: 15px;
}
.City_User:active {
    margin: 0;
    bottom: 2px;
    border-radius: 5px;
    color: rgb(245, 245, 245);
    box-shadow:1px 1px 2px 0px rgb(65, 65, 65);
}
.City_User {
    position: relative;
    transition: 0.1s;
    background-color: #40d16b;
    color: #fff;
    margin: 1px 0 0;
    border-radius: 10px;
    padding: 6px;
    bottom: 3px;
}
.aside_button_form{
    position: relative;
    right: 13px;
}
form div {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
  }
.City_User:hover {
cursor: pointer;
border-radius: 8px;
}
.Reset_form{
    font-size: 12px !important;
}
.button{
    background-color: #2EBD75;
    padding: 10px 5px;
    margin-bottom: 20px !important;
    color: #fff;
    border:none;
    outline: none;
    border-radius: 5px;
    cursor: pointer;
}
.addbtn{
    text-align: center;
    position: absolute;
    top: 10px;
    right: 16px;
    padding: 8px 13px;
    margin: 0 ;
    z-index:9;
}
#labelTable{
    position: relative;
    top: 20px;
}
.addDiv{
    margin:  0 auto;
    display: inline;
}
#login-form .button{
margin-top: 40px;
}
.button:focus,.button:active{
    background-color: #40d16b;
    outline: none;
}
.button:hover{
    background-color: #40d16b;
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.2);
}
.btn{
    min-width: 100px;
    margin:2px 8px ;
}
/* 
button.btn.btn-success{
    position: absolute;
    bottom: -48px;
    left: 120px;
}
button.btn.btn-danger {
    position: absolute;
    bottom: -48px;
    left: 0px;
}
button.Reset_form.btn.btn-dark {
    position: absolute;
    bottom: -48px;
    left: 220px;
    min-height: 30px;
} */
@media (max-width: 480px){
    #rowlogin{
        padding: 0.5rem;
    }
}
/*----header ----*/
header{
    min-height: 76px;
    padding: 15px;
    box-shadow: 0 0.5rem 1rem 0 rgba(44, 51, 73, 0.1);
    max-height: 76px;
    position: fixed !important;
    top:0;
    z-index: 10;
}
#profile{
    float: left;
    position: absolute;
    left: 120px;
    top: 25px;
    padding: 5px 10px;
    cursor: pointer;
    border-right: solid 1px rgba(153, 153, 153, 0.692);
    z-index: 5;
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none;
}

#profile:hover{
    border-bottom: solid 1px rgba(153, 153, 153, 0.2);
    transition: 0.2s;
}
.d-inline img {
    max-width: 50px;
}
.d-inline h3{
    font-size: 25px;
}
#demo1{
    position: absolute;
    padding:12px 5px;
    background-color: #fff !important;
    min-width:150px;
    border-radius: 5px;
    border-right: solid 1px #eee;
    border-bottom: solid 1px #eee;
}
.border-b{
    border-bottom: 1px solid #edf1f7;
    padding-top: 20px;
}
#demo1 li{
    padding: 10px 5px;
}
#demo1 a{
    color: #444;
}
#demo1 li a:hover{
    color: #2EBD75;
}
/*--- .fa ----*/
.fa-file-alt{
    font-size: 16px;
    color: #4f555a;
}
#profile .fa.fa-user {
    color: #3bb839;
}
.fa-edit{
    color: #2EBD75;
}
.fa-edit:hover{
    color: #008141;
}
.fa-trash-alt:hover{
    color: rgb(194, 0, 0);
}

.far , .fa , .fa-key{
    border: none !important;
}
.fa-key:hover,
.fa-trash-alt:hover,
.fa-edit:hover,
td .fa:hover,td .far:hover{
    cursor: pointer;
}
.fa-eye{
    color: #2EBD75;
}
.fa_cal{
    position: absolute;
    top: 10px;
    left: 8px;
    font-size:16px;
    
}
.margin-left8{
    margin: 0 8px;
}
/*--- sidebar -----*/
#rightCol{
    max-width: 256px ;
    top: 0;
    margin: 0;
    padding:25px 10px 0 10px;
    min-width: 240px;
    background-color: #fff;
    height: 100%;
    overflow: auto;
    box-shadow: -0.5rem 0 1rem 0 rgba(44, 51, 73, 0.1);
    position: relative !important;
    top: 77px;
    transition: 0.6s;
}
.sidebar {
    max-width: 256px !important;
    margin: 0;
    padding:5px 0 25px 0 !important; 
    min-width: 240px;
    width: 240px;
    min-height: 100%;
    background-color: #fff;
    height: 100%;
    overflow: auto;
    box-shadow: -0.5rem 0 1rem 0 rgba(44, 51, 73, 0.1);
    position: fixed !important;
    right: 0;
    top: 77px;
    transition: 0.6s;
  }
  
  .sidebar .fa {
      font-size: 20px;
      transition: 0.3s;
  }
  .faSide{
     position: absolute; 
    right: 40px;  
    font-size: 17px !important;
}
  .sidebar a {
    display: block;
    color: #555;
    padding: 14px 15px;
    border-bottom: 1px solid #edf1f7;
    font-weight: bold;
    font-size: 13px;
    border-radius: 3px;
  }
  .sidebar a.active {
    color: #40d16b;
  }
  .sidebar a:hover:not(.active) {
    background-color: #40d16b;
    color: white;
    box-shadow: 0 0 10px 1px rgba(230, 230, 230, 0.9);
  }
  #tab{
      font-size: 22px;
  }
  #tab i{
    padding: 15px;
    transition: 0.2s;
  }
  #tab i:hover{
    color:#40d16b ;
  }
  #tab:hover{
      cursor: pointer;
  }
  .Tabclose{
      max-width: 75px !important;
      min-width: 75px !important;
  }
  .d_none{
    display: none;
    transition: 0.3s;
  }
  .content-close{
    flex: 0 0 90%!important;
    max-width: 90%!important;
  }
  .duration_1{
    animation-duration: 1s !important;
  }
  .duration_2{
    animation-duration: 1.3s !important;
  }
  .duration_3{
    animation-duration: 1.6s !important;
  }
  .duration_4{
    animation-duration: 1.8s !important;
  }
  .duration_5{
    animation-duration: 2.2s !important;
  }

  div.content {
    margin-left: 200px;
    padding: 1px 16px;
    height: 1000px;
  }
  .WeditModal{
    min-width: 850px;
}
  @media screen and (max-width: 500px) {
    .sidebar {
      width: 100%;
      height: auto;
      position: relative;
    }
    .sidebar a {float: left;}
    div.content {margin-left: 0;}
  }
  
  @media screen and (max-width: 400px) {
    .sidebar a {
      text-align: center;
      float: none;
    }
  }
  @media screen and (max-width: 1024px) {
    div#SideBar {
        min-width: 180px;
        width: 180px;
    }
    div#rightCol {
        max-width: 170px;
        min-width: 150px;
    }
    .faSide {
        right: 14px;
    }
  }
  @media screen and (max-width:1250px) and (min-width:1024px) {
    div#SideBar {
        min-width: 205px;
        width: 200px;
    }
    div#rightCol {
        width: 141px;
        min-width: 200px;
    }
  }

  /**---content---*/

  .body{
      width: 100%;
      display: flex;
  }

  #content{
    margin: 21px auto 30px;
    background-color: #fff;
    border-radius: 5px;
    position: relative;
    top:76px;
    flex: 0 0 78%;
    max-width: 80%;
    padding: 20px 10px 30px;
    transition: 0.6s;
}

  .myTable {
    position: relative;
    top: 20px;
    scroll-behavior: smooth;
    width: 100%;
    border-radius: 5px;
    margin: 20px auto!important;
  }
   .myTable *{
    border: 1px solid #edf1f7 !important;
  } .myTable i{
    border:none!important;
    padding: 5px 10px;
  }
  
thead {
    background-color: #6c757d;
}
.myTable td,.myTable th {
    border: 1px solid #dddddd;
    text-align: center !important;
    padding: 8px;
    min-width: 55px;
    max-width: 95px;
    font-weight:400 !important;
    color: #1a2138 ;
    font-size: 13px;
    cursor: default;
  }
  tr > :first-child {
      max-width: 45px !important;
      min-width: 25px !important;
  }
  .report-th-size {
    width: 85px!important;
}
  .th-size{
    max-width: 40px !important;
    min-width: 25px !important;
}

.statusTD {
    min-width: 120px !important;
    width: 140px!important;
}
  .pagination{
    border: 1px solid #edf1f7;
    padding: 0 !important;
  }
  .active_pagination{
    background-color: #cbdaef!important;
  }
  .active_page{
    background-color:#40d16b;
    color : #fff;
  }
  thead th{
    font-weight: bold !important;
    color: #fff !important;
}
#pagination{
    margin: 40px 0 20px;
    padding-top: 30px;
    display: flex;
    justify-content: center;
}
#pagination li a {
    padding: 9px 15px;
    border: none;
    margin: 0 1px;
    cursor: pointer;
  }
  
  #pagination li:not(:last-child){
    border-left: 1px solid #eeeeee;
  }
  .page-link{
      background-color: rgba(255, 255, 255, 0) !important;
      color: #000;
    }
#pagination li:hover *{
    background-color: #40d16b !important;
    color: #fff !important;
}


  .page-item:first-child .page-link {
    margin-left: 0;
    border-radius: 0 5px 5px 0 !important;
}
.page-item:last-child .page-link {
    margin-left: 0;
    border-radius: 5px 0 0 5px!important;
}
  .even:hover , .odd:hover{
    background-color: #edf1f7 !important;
}
  tr:nth-child(even) {
    background-color: #f7f9fc ;
    border-radius: 5px !important;
    padding: 10px 5px !important;
  }
  .navDisable:hover *{
    background-color: #fff !important;
    color: #6c757d !important;
}
#pagination{
display: flex;
justify-content: center;
}
  /*--------*/
  .newForm {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}
.chnagepassform{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}
.chnagepassform div{
    margin: 0 auto;
}
#ChangepassForm input{
	min-width:350px;
}
.newForm input:before{
    content: '';
    color: red;
}
.newForm button{
    max-height: 40px;
    min-height: 40px;
}
.newForm input, .newForm select{
    max-height: 40px;
    min-height: 40px;
    padding-right: 8px;
    min-width: 230px;
}

.newForm input::placeholder, .newForm select::placeholder{
    font-size: 14px;
    text-align: center;
}
form#Status_driver_request {
    padding-bottom: 5px;
}
input[type=checkbox]{
    min-height: 5px;
}
.checkboxText{
    font-size: 12px !important;
}
.Eyes{
    position: relative;
    top:4px;
    left: 35px;
    color: #5c5c5c;
    cursor: pointer;
    font-size: 13px;
}
.explain {
    min-width: 400px;
    min-height: 50px;
}
/*-----*/
.modalSpan{
    float: right !important;
    text-align: right !important;
    font-size: 12px !important;
}
.modal-footer{
    justify-content: space-between !important;
}
.space-between{
    justify-content: space-between !important;
    }
    
/*--------------------*/
.dataTables_filter {
    position:absolute;
    top: 10px;
    left: 20px;
    font-size: 13px;
    display: flex;
    flex-direction: row;
    z-index: 9;
}
.Report_dataTables_filter {
    position:absolute;
    top: 10px;
    right: 5px;
    font-size: 13px;
    display: flex;
    flex-direction: row;
    z-index: 9;
}
#SubmitBtnRPRT{
    margin-right: 10px;
}
.searchSubmit {
    max-height: 40px;
    margin-right: 2px;
    position: relative;
    text-align: center;
    border: solid 1px rgba(0,0,0,0.1);
    outline: none;
    background-color: #f7f9fc !important;
    padding: 10px 10px;
    margin-bottom: 10px !important;
    transition: ease-in-out 0.2s;
    height: auto !important;
    border-radius: 5px;
}
.search_Select {
    max-width: 100px !important;
    min-width: 100px;
    max-height: 40px;
    padding: 0;
    margin: 0 !important;
    font-size: 11px !important;
}
input[type="search"] {
    max-height: 40px;
    margin-right: 2px;
}
#water_type_tab {
    display: flex;
    top: 35px;
    margin: 0;
    position: relative;
    width: 100%;
    padding: 0;
    border: solid 1px #6C757D;
    border-radius: 50px;
    font-size: 15px;
}
.water_type_tab {
    padding: 5px 0;
    cursor: pointer;
    transition: 0.2s;
}
.water_type_tab:hover{
background-color:#6C757D ;
color: #fff;
}
.active_tab{
    background-color: #2EBD75 !important;
    color: #fff !important;
}
#Livestockـwater{
    border-radius:50px 0 0 50px;
}
#drinkable{
    border-radius:0 50px 50px 0;
}
/*-- req table --*/
.bg-not-seen{
    background-color: rgba(220 ,53 ,69 , 0.75) !important;
}
.bg-allocate-driver{
background-color: rgba(23, 163, 184, 0.75);
}
.bg-deliver-driver{
    background-color: rgba(40, 167, 70, 0.75)!important;
}
.bg-recive-nomad{
    background-color: rgb(40, 167, 70,0.9)!important;
}
/*  */
.bg-not-seen:hover{
    background-color: rgba(220 ,53 ,69 , 1) !important;
}
.bg-allocate-driver:hover{
background-color: rgba(23, 163, 184, 1);
}
.bg-deliver-driver:hover{
    background-color: rgba(40, 167, 70, 1)!important;
}
.bg-recive-nomad:hover{
    background-color: rgba(40, 167, 70,1)!important;
}
.bg-confirm-both:hover{
    background-color: rgb(40, 167, 70)!important;
}
.bg-dark:hover{
    background-color: rgb(0, 0, 0)!important;
}
#ReportTable {
    position: relative;
    top: -25px;
}
@media print and (min-width: 768px) {
    #rightCol , #SideBar , .button , .dataTables_filter , .Report_dataTables_filter , .dis-none-print , #profile  , #pagination , .btn {
        display: none !important;
    }
#labelTable {
    top: 0px;
}
    .count_all{
        bottom: -55px !important;
    }
    .myTable{
        top: -10px  !important;
    }
    * , th , td , span , a  , thead th  , thead{
        background-color: #fff !important;
        color:#000 !important;
    }

    .dis-icon-print{
        display: none;
    }
    .col-th-110{
    min-width: 110px !important;
    }
    .showPrintDate{
        display:inline !important;
        position: absolute;
        top: 20px;
        right: 20px;
    }
    .myTable * {
        border: 1px solid #000!important;
    }
  }
  .showPrintDate{
      display: none;
  }
/* Filter page */
.Exell-report-filter {
    position: absolute;
    top: 10px;
    left: 32px;
    font-size: 13px;
    display: flex;
    flex-direction: row;
    z-index: 9;
}
#closeModal{
    cursor: pointer;
}
.loading{
    max-width: 50px;
    position: absolute;
    top: 45%;
}
#ReportingTable {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    margin-top: 48px;
    border: solid 1px #6C757D;
    border-radius: 15px;
}
.Report-information {
    font-size: 0.9rem;
    padding: 2px;
    display: flex;
    margin: 4px;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:space-between;
}
.reportSide {
    border-left: solid 1px #6C757D;
}
.radioFilter {
    margin-left: 15px;
}