/* Override table font from ajax_datatable/css/style.css */
table.dataTable {
  font-size: 100%;
  border-collapse: collapse !important;
}
.table>:not(caption)>*>* {
  padding: .5rem !important;
}

.dataTables_length select {
  width: 70px !important;
}

.paginate_button .page-link {
  color: var(--bs-secondary) !important;
}

.paginate_button.active .page-link {
  color: var(--bs-white) !important;
}

.dataTables_wrapper {
  width: 100%;
}

.dataTables_wrapper .dataTables_length {
  float: left;
}
.dataTables_wrapper .dataTables_filter {
  float: right;
}
.dataTables_wrapper .dataTables_info {
  float: left;
}
.dataTables_wrapper .dataTables_paginate {
  float: right;
}

tbody, td, tfoot, th, thead, tr {
  border-color: #e7efe6!important;
  border-style: solid;
  border-width: 0;
}

label {
  margin-bottom: 0!important;
  margin-left: 5px!important;
  color: #8392ab!important;
  font-weight: 400!important;
}

.dt-empty,
.dataTables_empty {
  font-size: 12px;
  color: #8392ab!important;
  font-weight: 400!important;
}

div.dt-container .dt-input {
  border-color: #e9ecef;
  border-radius: 0.25rem;
  padding: 4px!important;
  background-color: transparent;
  color: inherit;
  font-size: 10px!important;
}

.action-button{
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8392ab!important;
  margin: 0 4px!important;
  border: 1px solid #dee2e6!important;
  width: 28px!important;
  height: 21px!important;
  font-size: 15px!important;
  margin-left: 0!important;
  padding: 0!important;
  border-radius: 5px!important;
  background: transparent!important;
}

.action-button:hover{
  background: #e4e4e4!important;
}

div.dt-container .dt-paging .dt-paging-button,
div.dt-container .dt-paging .dt-paging-button.disabled,
div.dt-container .dt-paging .dt-paging-button.disabled:hover {
  color: #8392ab!important;
  margin: 0 4px!important;
  border: 1px solid #dee2e6!important;
  border-radius: 50%!important;
  width: 28px!important;
  height: 28px!important;
  font-size: 10px!important;
  margin-left: 0!important;
  padding: 0!important;
}

div.dt-container .dt-paging .dt-paging-button.current,
div.dt-container .dt-paging .dt-paging-button.current:hover {
  background: transparent!important;
  background-image: linear-gradient(310deg,#5e72e4,#825ee4)!important;
  color: #fff!important;
  border: none!important;
  border-radius: 50%!important;
}

div.dt-container .dt-paging .dt-paging-button:hover {
  color: #8392ab!important;
  margin: 0 4px!important;
  border: 1px solid #dee2e6!important;
  border-radius: 50%!important;
  width: 28px!important;
  height: 28px!important;
  font-size: 10px!important;
  margin-left: 0!important;
  padding: 0!important;
  background: #e4e4e4!important;
}

table.dataTable th.dt-type-numeric,
table.dataTable th.dt-type-date,
table.dataTable td.dt-type-numeric,
table.dataTable td.dt-type-date {
  text-align: left;
}

.bold-row {
  font-weight: bold;
  background-color: rgba(245, 245, 245, 0.847)
}

.modal-fullscreen-inset {
  max-width: calc(100vw - 56px)!important;
}

.ol-layer canvas {
  border-radius: 10px!important;
}

.status-value{
  width: 100%!important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #8392ab!important;
  border: 1px solid #dee2e6!important;
  font-size: 15px!important;
  margin-left: 0!important;
  border-radius: 5px!important;
  background: transparent!important;
}

.filter-button, .filter-button:active {
  padding: 0.25rem 0.75rem;
  font-size: .75rem;
  border-radius: 0.5rem;
  line-height: 1.4rem;
  width: 100%;
  transform: none!important;
  box-shadow: none!important;
  background: transparent!important;
  color: #2dce89!important;
}

.export-button, .export-button:active {
  font-size: .75rem;
  border-radius: 0.5rem;
  line-height: 1.4rem;
  width: 100%;
  transform: none!important;
  box-shadow: none!important;
  background: transparent!important;
  color: #2d4ace!important;
}

.secondary-button, .secondary-button:active {
  padding: 0.25rem 0.75rem;
  font-size: .75rem;
  border-radius: 0.5rem;
  line-height: 1.4rem;
  width: 100%;
  transform: none!important;
  box-shadow: none!important;
  background: transparent!important;
  color: #4b4b4b!important;
}

.clear-button, .clear-button:active {
  padding: 0.25rem 0.75rem;
  font-size: .75rem;
  border-radius: 0.5rem;
  line-height: 1.4rem;
  width: 100%;
  transform: none!important;
  box-shadow: none!important;
  background: transparent!important;
  color: #f5365c!important;
}

.hover-button-success:hover {
  background: #2dce8831!important;
  transform: none!important;
}

.hover-button-danger:hover {
  background: #f5365c38!important;
  transform: none!important;
}

.status-circle {
  width: 15px!important;
  height: 15px!important;
  border-radius: 50%!important;
}