@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css");
html{
  overflow-x:hidden !important;
}
body {
  font-family: "Inter", serif !important;
  font-optical-sizing: auto;
  /* background: #ededed;
    height: 100%; */
}
/* html, 
body {
    height: 100% !important;
} */
.hide {
  display: none !important;
}
.help-block {
  color: #dc3545 !important;
}
th.skip-export {
  width: 5% !important;
}
.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }

  @media (min-width: 768px) {
    .bd-placeholder-img-lg {
      font-size: 3.5rem;
    }
  }

  .b-example-divider {
    width: 100%;
    height: 3rem;
    background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
  }

  .b-example-vr {
    flex-shrink: 0;
    width: 1.5rem;
    height: 100vh;
  }

  .bi {
    vertical-align: -.125em;
    fill: currentColor;
  }

  .nav-scroller {
    position: relative;
    z-index: 2;
    height: 2.75rem;
    overflow-y: hidden;
  }

  .nav-scroller .nav {
    display: flex;
    flex-wrap: nowrap;
    padding-bottom: 1rem;
    margin-top: -1px;
    overflow-x: auto;
    text-align: center;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .btn-bd-primary {
    --bd-violet-bg: #712cf9;
    --bd-violet-rgb: 112.520718, 44.062154, 249.437846;

    --bs-btn-font-weight: 600;
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bd-violet-bg);
    --bs-btn-border-color: var(--bd-violet-bg);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: #6528e0;
    --bs-btn-hover-border-color: #6528e0;
    --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
    --bs-btn-active-color: var(--bs-btn-hover-color);
    --bs-btn-active-bg: #5a23c8;
    --bs-btn-active-border-color: #5a23c8;
  }

  .bd-mode-toggle {
    z-index: 1500;
  }

  .bd-mode-toggle .dropdown-menu .active .bi {
    display: block !important;
  }

  .bi {
    display: inline-block;
    width: 1rem;
    height: 1rem;
  }
  
  /*
   * Sidebar
   */
  
  @media (min-width: 768px) {
    .sidebar .offcanvas-lg {
      position: -webkit-sticky;
      position: sticky;
      top: 48px;
    }
    .navbar-search {
      display: block;
    }
  }
  
  .sidebar .nav-link {
    font-size: .875rem;
    font-weight: 500;
    color: #fff;
  }
  .sidebar-heading {
    font-size: .75rem;
  }
  .nav-link:hover, .nav-link:focus
 {
    color: #ffffff !important;
}

  /* Breadcrumb */
  .breadcrumb{
    background:#eee;
    padding:10px;
    font-size: 14px !important;
  }
  .breadcrumb li {
    margin-right: 10px;
    display:flex;
  }
  .breadcrumb > li + li:before {
    display: inline-block;
    padding-right: .5rem;
    color: #6c757d;
    font-family: bootstrap-icons;
    content: "\F285";
}

  .breadcrumb li a{
    text-decoration: none;
  }
  /*
   * Navbar
   */
  .navbar{
    background-color: rgb(255, 255, 255) !important;
    color: black !important;
  }
  .navbar-brand {
    padding-top: .75rem;
    padding-bottom: .75rem;
    background-color: rgba(0, 0, 0, .25);
    /* box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25); */
  }
  
  .navbar .form-control {
    padding: .75rem 1rem;
  }
  
  .bi {
    display: inline-block;
    width: 1rem;
    height: 1rem;
  }
  
  /*
   * Sidebar
   */
  .sidebar{
   background: #0A58CA;
   color:initial !important;
  }
  @media (min-width: 768px) {
    .sidebar .offcanvas-lg {
      position: -webkit-sticky;
      position: sticky;
      top: 48px;
    }
    .navbar-search {
      display: block;
    }
  }
  .sidebar{
    /* position: fixed; */
    min-height: 100vh !important;
    overflow-y:scroll ;
    scroll-behavior: smooth;
    bottom: 0;
    top:48px;
}
  
.sidebar-offcanvas{
   background: #0A58CA;
  }
  /* .sidebar .nav {
    padding-top: 50px;
} */
  .sidebar .nav-link {
    font-size: .875rem;
    font-weight: 500;
    margin: 2px 5px;
    padding: 10px;
    border-radius: 5px;
  }
   .sidebar .nav-link:hover, .sidebar .nav-link:active {
    background: #0D6EFD !important;
    color: #fff !important;
}
  /* .sidebar .nav-link.active {
    color: #2470dc;
  } */
  .sidebar .nav-link.active {
    color: #ffffff;
    background: #0D6EFD;
}
  .sidebar-heading {
    font-size: .75rem;
  }
  .sidebar::-webkit-scrollbar {
  width: 10px;
  border-radius: 10px;
}

/* Track */
.sidebar::-webkit-scrollbar-track {
  background: #0033ff1e; 
}
 
/* Handle */
.sidebar::-webkit-scrollbar-thumb {
  background: #003585;
  border-radius: 10px;
}

/* Handle on hover */
.sidebar::-webkit-scrollbar-thumb:hover {
  background: #dedbff; 
}
  /*
   * Navbar
   */
  
  .navbar-brand {
    padding-top: .75rem;
    padding-bottom: .75rem;
    background-color: rgba(0, 0, 0, .25);
  }
  
  .navbar .form-control {
    padding: .75rem 1rem;
  }
  

  /*
   * Chart CSS
   */

  /*
   * Intersection Data Page
   */
   .locations-list{
    height: 200px;
    overflow-y: auto !important;
   }
   
   .start-date, .end-date, .start-time, .end-time, .all-locations, .locations-list, .counter {
    font-size: 14px !important;
}
.export-buttons {
  position: absolute !important;
  right: 16px;
  top: 12px;
  z-index: 1025 !important;
}
.report .dropdown-menu a, .export .dropdown-menu a{
  font-size: 14px !important;
}

/* Modal */
#addModal .modal-dialog .modal-content .modal-header{
  border-bottom:0 !important;
}
#addModal .modal-dialog .modal-content .modal-body #addModalContent .company-create .create #w0 .field-phase-name .control-label{
  display:none !important;
}
#addModal .modal-dialog .modal-content .modal-header .modal-title{
  /* font-size: 13px; */
}

/* Filter */
.filter-button .dropdown-menu {
  font-size:14px !important;
}
.filter-button .dropdown-menu .form-check {
  
}
.filter-button .dropdown-toggle::after {
  display:none !important;
}

/* Datatable */
table {
    font-size: 14px !important;
}
#grid-table .dropdown-toggle::after{
  /* display: none !important; */
}
.kv-grid-container {
  position: initial !important;
}
.kv-table-header, .kv-table-header th {
  background: #F1F3F9 !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-accent-bg: #fff !important;
  color: var(--bs-table-striped-color);
}
.table-striped > tbody > tr:nth-of-type(even) > * {
  --bs-table-accent-bg: #F8F9FC !important;
  color: var(--bs-table-striped-color);
}


table.dataTable>thead .sorting:before, table.dataTable>thead .sorting:after, table.dataTable>thead .sorting_asc:before, table.dataTable>thead .sorting_asc:after, table.dataTable>thead .sorting_desc:before, table.dataTable>thead .sorting_desc:after, table.dataTable>thead .sorting_asc_disabled:before, table.dataTable>thead .sorting_asc_disabled:after, table.dataTable>thead .sorting_desc_disabled:before, table.dataTable>thead .sorting_desc_disabled:after {
    bottom: 0.5em !important;
}

#grid-table > tbody > tr > td.skip-export.kv-align-center.kv-align-middle.w0 > div > button,#grid-table > tbody > tr > td.skip-export.kv-align-center.kv-align-middle.w0 > div > button:hover{
  border: none !important;
  box-shadow: none !important;
  background: none !important;
  color: initial !important;
}
#grid-table > tbody > tr > td.skip-export.kv-align-center.kv-align-middle.w0 > div > button::after{
  display: none !important;
}
#grid-table, #grid-table > thead > tr > th, #grid-table .dropdown-menu{
  font-size:14px !important;
}
#grid-table .dropdown-menu{
  border:none !important;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}
/* #grid-table_wrapper > div:nth-child(2) > div{
  overflow-x:auto !important;
} */
#grid-table_wrapper::-webkit-scrollbar {
  display: none;
}
.select2-container--krajee-bs5 .select2-selection--single {
    height: calc(2rem + 1px) !important;
    line-height: 1.3 !important;
    padding: 0.375rem 1.5rem 0.375rem 0.5rem !important;
    font-size:14px !important;
}
.select2-container--krajee-bs5 .select2-selection, .select2-container--krajee-bs5 .select2-search--dropdown .select2-search__field {
    box-shadow: none !important;
    }

    .select2-container--krajee-bs5 .select2-results > .select2-results__options {
   
    font-size: 14px !important;
}
div.dataTables_wrapper div.dataTables_length label, div.dataTables_wrapper div.dataTables_filter label {
    font-size: 14px !important;
}
.page-link {
    font-size: 13px !important;
}
.modal-header, .modal-title {
  font-size:16px !important;
}
table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable td:last-child, table.table-bordered.dataTable td:last-child {
    border-right-width: inherit !important;
}
.control-label{
        display:none !important;
    }

    .nav-tabs .nav-link{
        background: #0A58CA !important;
        color:#fff !important;
        padding: 8px 16px !important;
        font-size: 14px !important;
}

.nav-tabs .nav-link:hover {
    /* color: #ff0000 !important; */
    background: #053a87 !important;
}
.nav-tabs .nav-link.active {
    /* color: #000000 !important; */
    background: #053a87 !important;
}
.nav-tabs .nav-link {
    padding: 4px 16px !important;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    border-color: var(--bs-nav-tabs-link-active-border-color) !important;
}
/*.card-header{
    display:none !important;
}*/
.tab-content {
    padding: 0.625rem 0 !important;
}
.text-right {
    text-align: right !important;
}

.role-permision{
  width:25% !important;
  /* min-height: 100vh !important; */
}


/* X-Small devices (portrait phones, less than 576px)
No media query for `xs` since this is the default in Bootstrap */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 

   .sidebar{
    /* display:none; */
   /* background: none;
   color:initial !important; */
   min-height: auto !important;
   background: #0A58CA !important;
   
  }
  .offcanvas-md.offcanvas-start{
    background: #0A58CA !important;
  }
  .container-fluid{min-height: 100vh !important;}
  
 }

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
 .sidebar{
    /* display:none; */
   /* background: none;
   color:initial !important; */
   min-height: 100vh !important;
   background: #0A58CA !important;
   
  }
  .offcanvas-md.offcanvas-start{
    background: #0A58CA !important;
  }
  .container-fluid{min-height: 100vh !important;}
 }

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

 }

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

 }

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {

 }


/* xs returns only a ruleset and no media query */
/* {  } */

/* sm applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
  .sidebar{
    /* display:none; */
   /* background: none;
   color:initial !important; */
   min-height: auto !important;
   background: #0A58CA !important;
   
  }
  .offcanvas-md.offcanvas-start{
    background: #0A58CA !important;
  }
  .container-fluid{min-height: 100vh !important;}
  .nav-link:focus, .nav-link:hover {
    color: var(--bs-nav-link-hover-color) !important;
    border: var(--bs-border-width) solid var(--bs-navbar-toggler-border-color) !important;
}
.navbar-toggler:focus {
    box-shadow: none !important;
}
.role-permision{
  width:100% !important;
  /* min-height: 100vh !important; */
}
.company-dashboard-filter{
  flex-direction: column !important;
}
 }

/* md applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) { 
      div.dataTables_wrapper div.dataTables_length, div.dataTables_wrapper div.dataTables_filter, div.dataTables_wrapper div.dataTables_info, div.dataTables_wrapper div.dataTables_paginate {
        text-align: right !important;
        padding: 5px 0 !important;
 }
}
/* lg applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) { }

/* xl applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) { }

/* xxl applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) { }

@media screen and (max-width: 480px) {
    .kv-table-wrap th, .kv-table-wrap td {
        display: table-cell !important;
        /* width: 100% !important;
        text-align: center; */
        font-size: 1.3em !important;
    }
        .kv-table-wrap tr > td:first-child {
        border-top: none !important;
    }
    /* td.w0.kv-grid-group.kv-group-even, td, th {
    font-size: 1em !important;
} */
 tr.w0.odd , tr.w0.even{
    font-size: 11px !important;
}
}