:root {
  --iw-primary-color: #262d33; 
  --iw-action-btn-color: #00acac; 
  --iw-inner-action-btn-background:#adadad78;
  --iw-white-color:#f5f5f5;
  --text-color: #ffffff; 
  --shadow-color: rgba(0, 0, 0, 0.2); 
  --border-color:#ced4da;
}


/* common grid css */
.common-grid {
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
/* common grid css */

/* width */
::-webkit-scrollbar {
    width: 10px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: #f1f1f1;
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #888;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #555;
  }
 
  .panel-heading {
    background: var(--iw-action-btn-color) !important;
    color: var(--bs-white);
    border-radius: unset !important;
    -webkit-border-radius: unset !important;
    -moz-border-radius: unset !important;
    -ms-border-radius: unset !important;
    -o-border-radius: unset !important;
}

.app-content{padding: 0px;}

.panel-body{
  height: calc(100vh - 94px);
  overflow-y: auto;
  padding: 0px !important;
}

.panel{
  margin: 0px !important;
  overflow: visible !important;
}

.btn-zipcode{
  background: var(--iw-action-btn-color) !important;
  border: none;
  position: absolute;
  top: 0;
  right: 0;
  height: -webkit-fill-available;
  border-radius: 0px 5px 5px 0px;
}

.dt-scroll-body{
  height:calc(100vh - 190px) !important;
  max-height: none !important;
}

#data-table-fixed-columns_wrapper .row, #data-table-colreorder_wrapper .row {
    margin: 0px !important;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { 
  background: var(--iw-action-btn-color); color: #FFF; 
} 

.form-check-input:checked {
  background-color: var(--iw-action-btn-color) !important;
  border-color: var(--iw-action-btn-color) !important;
}

.app-header, .app-sidebar-content{
  background: var(--iw-primary-color) !important;
}

.app-sidebar-minify-btn{
  background: var(--bs-app-sidebar-minify-btn-hover-bg) !important;
}

.top-title b , .app-header .navbar-nav .navbar-item .navbar-link , .app-header .navbar-brand{
  color:var(--text-color) !important;
}

.top-title .Title{
  font-size:18px;
}

#header{
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr 1fr 1fr;
}

.top-title{
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.row{
  margin:0px !Important;
}

.tabContent ul li:first-child a{
  border-radius: 0px 5px 0px 0px !Important;
  -webkit-border-radius: 0px 5px 0px 0px !Important;
  -moz-border-radius: 0px 5px 0px 0px !Important;
  -ms-border-radius: 0px 5px 0px 0px !Important;
  -o-border-radius: 0px 5px 0px 0px !Important;
}

.innerTabsENPT{
  height: calc(100vh - 280px) !important;
  padding: 5px !important;
}

.InnerNavPills{
  margin: 5px;
  width: fit-content;
  box-shadow: rgba(0, 0, 0, 0.35) 2px 1px 4px;
  border-radius: 5px;
}

.InnerNavPills a:first-child{
  border-radius: 5px !important;
  width: 70px;
  text-align: center;
} 

.InnerNavPills .nav-link.active, .InnerNavPills .show>.nav-link{
  background-color: var(--iw-action-btn-color);
  border-radius: 5px !important;
}

.tabContent{
  height: calc(100vh - 199px);
}

.tabContent > ul{
  border-bottom: 1px solid var(--iw-action-btn-color) !Important;
}

.tab-content{
  height: calc(100vh - 234px);
  overflow: auto;
  max-width: 1860px;
}

.map-container iframe{
  border-radius: 5px !important;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
.btn:focus-visible{
  box-shadow: 0 0 0 .25rem rgba(52, 143, 226, .25);
}
.modal-dialog{
  max-width:800px !important;
}

table.dataTable.table-striped > tbody > tr.highlight > * , table tbody tr.highlight{
  background: var(--iw-action-btn-color) !important;
}

table.dataTable.table-striped > tbody > tr.highlight > td, table tbody tr.highlight td{
  color: var(--bs-white) !important;
}

table.table-striped>tbody>tr.highlight:nth-of-type(odd)>* {
  --bs-table-bg-type: var(--iw-action-btn-color) !important;
}

.nav-tabs .nav-item a{
  width: 120px;
  text-align: center;
  padding: 8px 0px;
}

.btn-zipcode:hover .fa{
  transform: scale(1.2);
  transition: background-color 1s ease in out, transform 1s ease in out;
  -webkit-transition: background-color 1s ease in out, transform 1s ease in out;
  -moz-transition: background-color 1s ease in out, transform 1s ease in out;
  -ms-transition: background-color 1s ease in out, transform 1s ease in out;
  -o-transition: background-color 1s ease in out, transform 1s ease in out;
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
}

.inner-btn-action{
  background:var(--iw-inner-action-btn-background) !important;
  padding: 8px !important;
}
.inside-content{
  padding:5px;
}

#tblZipCode th:first-child,#tblZipCode td:first-child{
  width: 60%;
}

.getlatlngbtn{
  height: -webkit-fill-available;
  border: var(--border-color);
  background:var(--iw-action-btn-color) !important;
}
.getlatlngbtn i{
  color:var(--iw-white-color) !important;
}
.getlatlngbtn:hover i{
  -webkit-transform: scale(1.2);
}

#data-table-colreorder_wrapper .col-12{
  padding:0px;
}
/* =================== only simple modal table css here start ==============  */
.modal-header{  
  background-color: var(--iw-primary-color);
  color: var(--iw-white-color);
  border: none;
}
 
.modal .modal-header button{
  filter: var(--bs-btn-close-white-filter);
}

.modal .modal-body{
  height: calc(100vh - 20rem) !important;
  overflow: auto;
  padding: 0;
}

.modal .modal-body table thead {
  position: sticky;
  top: 0;
  background-color: var(--iw-action-btn-color) !important;
  text-align: center;
}

.modal .modal-body table thead th{
  color: var(--iw-white-color);
}

.modal .modal-body table tr{
  display: table;
  table-layout: fixed;
  width: -webkit-fill-available !important;
  border-bottom: none;
  cursor: pointer;
}
/* =================== simple table css ==============  */

.form-floating .form-control, .form-floating .form-select {
  padding: 15px 0px 0px 12px !important;
  min-height: unset;
  height: 45px !important;
}
.GlobleSwitch .form-floating > label{
  padding: 8px;
}
.GlobleSwitch .form-select{
  height: 35px !important;
  border: none;
  width: 250px;
  padding: 0px 10px!important;
  cursor: pointer;
}
body #gritter-notice-wrapper{
  display:none;
}

.InnerZipCodeIcon path , .LatLngGlobeIcon path{
  fill:#FFF;
}

#ProfilesAndSettings > .dropdown-item.active, .dropdown-item:active{
  background-color: var(--iw-action-btn-color) !Important;
}