.dark-layout .form-control[type=file]::-webkit-file-upload-button {
  background-color: #283046;
}

.dark-layout .form-control[type=file]::file-selector-button {
  background-color: #283046;
}

div.DTS div.dataTables_scrollBody table {
  background-color: transparent;
}

table.dataTable.dtr-column > tbody > tr > td.dtr-control:before, table.dataTable.dtr-column > tbody > tr > th.dtr-control:before, table.dataTable.dtr-column > tbody > tr > td.control:before, table.dataTable.dtr-column > tbody > tr > th.control:before {
  background-color: #383D41;
}

div.dataTables_wrapper div.dataTables_filter label,
div.dataTables_wrapper div.dataTables_length label {
  margin-top: 0;
  margin-bottom: 0;
}
div.dataTables_wrapper .dataTables_scrollHeadInner {
  width: 100% !important;
}
div.dataTables_wrapper div.dataTables_wrapper .form-control,
div.dataTables_wrapper div.dataTables_wrapper .form-select {
  padding: 0.4rem 1rem;
}
div.dataTables_wrapper div.dt-button-collection {
  padding: 0;
}
div.dataTables_wrapper .br-0 {
  border-radius: 0;
}
div.dataTables_wrapper .dataTables_info {
  padding-top: 1.55rem !important;
}
div.dataTables_wrapper .dt-checkboxes-cell .form-check {
  padding-left: 1rem;
}
div.dataTables_wrapper .dt-checkboxes-cell .datatable-action {
  padding-left: 15px !important;
  padding-right: 15px !important;
}
div.dataTables_wrapper tbody tr {
  border-bottom: 1px solid #eee;
}
div.dataTables_wrapper tbody tr:has(.orderable-column:hover) {
  transform: translateY(-2px);
  box-shadow: 0 3px 10px 0 #ebe9f1;
  transition: all 0.2s;
  z-index: 1;
}
div.dataTables_wrapper .orderable-column {
  cursor: -webkit-grab;
  cursor: grab;
}
div.dataTables_wrapper .orderable-column {
  cursor: -webkit-grab;
  cursor: grab;
}
div.dataTables_wrapper .dataTables_scrollBody {
  min-height: 44.5vh;
  border-bottom: 1px solid #eee;
  border-left: none !important;
  background: none !important;
}

.dark-layout div.dataTables_wrapper tbody tr:nth-last-child(1) {
  border-bottom: 1px solid #3b4253 !important;
}
.dark-layout div.dataTables_wrapper .dataTables_scrollBody {
  border-bottom: 1px solid #3b4253 !important;
}
.dark-layout div.dataTables_wrapper tbody tr:has(.orderable-column:hover) {
  transform: translateY(-2px);
  box-shadow: 0 3px 10px 0 #3b4253;
  transition: all 0.2s;
  z-index: 1;
}
.dark-layout div.dataTables_wrapper .blockOverlay {
  background-color: #283046 !important;
}

.table > :not(:first-child) {
  border-top: none !important;
}

table.dt-rowReorder-float {
  outline: 2px solid #383D41;
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

tr.dt-rowReorder-moving {
  outline: 2px solid #383D41;
}

.danger.textarea-counter-value {
  background-color: #ea5455;
}

.table-icons .btn {
  width: 36px;
  margin: 1px;
}

.input-group:not(.bootstrap-touchspin):focus-within {
  box-shadow: none;
}

.nav-item.disabled {
  pointer-events: none !important;
}

.nav-item.disabled a {
  color: #b8c2cc !important;
}

.select2-results__option table {
  color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
}

.ql-editor.ql-blank::before {
  color: #b9b9c2;
  font-style: normal;
  font-size: 14px;
}

.ql-container.form-error ~ .ql-toolbar {
  border-color: #ea5455 !important;
}

.ql-container.form-error {
  border-color: #ea5455 !important;
}

.ql-container.read-only .ql-editor {
  padding: 0 !important;
}

select.error ~ .ms-container .search-input {
  border-color: #ea5455 !important;
}
select.error ~ .ms-container .ms-list {
  border-color: #ea5455 !important;
}

@media (max-width: 768px) {
  .dz-preview {
    width: 50% !important;
  }

  .dataTables_scrollBody {
    height: calc(100vh - 580px);
  }
}
@media (min-width: 768px) {
  .dz-preview {
    width: 33.3% !important;
  }

  .dataTables_scrollBody {
    height: calc(100vh - 500px);
  }
}
@media (min-width: 992px) {
  .dz-preview {
    width: 25% !important;
  }

  .dataTables_scrollBody {
    height: calc(100vh - 480px);
  }
}
@media (min-width: 1200px) {
  .dz-preview {
    width: 16.6% !important;
  }

  .dataTables_scrollBody {
    height: calc(100vh - 455px);
  }
}
.dz-preview {
  margin: 16px 0 16px 0 !important;
  padding: 0 16px 0 16px;
}
.dz-preview .dz-image {
  width: 100% !important;
  height: 100% !important;
}
.dz-preview .dz-image img {
  width: 100%;
}
.dz-preview a.dz-remove {
  display: none !important;
}
.dz-preview .btn-action button {
  position: absolute;
  z-index: 100;
  padding: 0.8rem;
  box-shadow: 0 5px 20px 0 rgba(34, 41, 47, 0.1);
  border-radius: 0.357rem;
  background-color: #fff !important;
  opacity: 1;
  transition: all 0.23s ease 0.1s;
  box-sizing: content-box;
  width: 0.75rem;
  height: 0.75rem;
  border: 0;
}
.dz-preview .btn-action .remove {
  right: 0;
  transform: translate(-10px, -15px);
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='currentColor'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/0.75rem auto no-repeat;
}
.dz-preview .btn-action .remove:hover {
  opacity: 1;
  outline: none;
  transform: translate(-15px, -8px);
  box-shadow: none;
}
.dz-preview .btn-action .order {
  left: 0;
  transform: translate(10px, -15px);
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='%23000' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-minus'%3E%3Cline x1='0' y1='1' x2='15' y2='1'%3E%3C/line%3E%3Cline x1='0' y1='8' x2='15' y2='8'%3E%3C/line%3E%3Cline x1='0' y1='15' x2='15' y2='15'%3E%3C/line%3E%3C/svg%3E") center/0.75rem auto no-repeat;
}
.dz-preview .btn-action .order:hover {
  opacity: 1;
  outline: none;
  transform: translate(15px, -8px);
  box-shadow: none;
}

.btn-group > :not(.btn-check) + .btn, .btn-group > .btn-group:not(:first-child) > .btn {
  max-width: 55px;
}

.multipleImageList tr:hover {
  transform: translateY(-4px);
  box-shadow: 0 3px 10px 0 #ebe9f1;
  transition: all 0.2s;
}

.galery_table .draggable:hover .handle {
  visibility: visible;
}

.draggable .handle {
  visibility: hidden;
  float: left;
  cursor: move;
  left: 20px;
  width: 1.75rem;
  height: 50px;
  padding: 0 5px;
  margin-right: 5px;
}

.draggable .handle:hover {
  background-color: #d8d8d8;
  border-radius: 3px;
  color: white;
}

.galery_table td {
  padding: 10px;
}

.touchspin input.touchspin::-webkit-outer-spin-button,
input.touchspin::-webkit-inner-spin-button {
  /* display: none; <- Crashes Chrome on hover */
  -webkit-appearance: none;
  margin: 0;
  /* <-- Apparently some margin are still there even though it's hidden */
}

input.touchspin {
  -moz-appearance: textfield;
  /* Firefox */
}

.draggable-nav-item {
  float: left;
}

.draggable-ul {
  padding: 0.61rem 0.61rem;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}

.draggable-ul:hover {
  background-color: #eee;
}

.draggable-ul .nav-handle {
  visibility: hidden;
  /*display: none;*/
}

.draggable-ul:hover .nav-handle {
  visibility: visible;
  /*display: block;*/
}

.nav-handle {
  float: left;
  margin-right: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
  border: 1px solid #ddd;
  border-radius: 2px;
  height: 30px;
}

.nav-handle:hover {
  background: #d8d8d8;
  color: white;
}

.nav-content {
  padding-top: 5px;
  padding-bottom: 5px;
  float: left;
}

.draggable-nav-item.gu-mirror {
  /*background-color: red;*/
  list-style: none;
  opacity: 0.7;
}

.field-card .card-header {
  background: rgba(130, 134, 139, 0.12) !important;
  color: #82868b !important;
  padding: 0.71rem 1rem;
  box-shadow: rgba(130, 134, 139, 0.4) 0px 6px 15px -7px;
}

.field-card {
  float: left;
}

.field-card .card-body {
  background: rgba(130, 134, 139, 0.12) !important;
}

.field-card .card-header .card-title {
  font-size: 1rem;
  margin-top: 3px;
  color: #82868b !important;
}

.field-card .card {
  transition: all 0.2s, border-color 0s;
}

.field-card.orderable:hover .card {
  transform: translateY(-4px);
  box-shadow: 0 3px 10px 0 #ebe9f1;
  transition: all 0.2s;
}

.field-card:hover .component-handle {
  visibility: visible;
}

.field-card .component-handle {
  visibility: hidden;
  position: absolute;
  cursor: move;
  left: 0.2rem;
  width: 1.75rem;
  top: 0;
  height: 3rem;
  padding: 0 5px;
}

.field-card .deleteComponent:hover {
  color: red;
}

.field-card .card-header:first-child {
  border-radius: 0.428rem;
}

.file-picker-table {
  /*background-color: red;*/
}

.file-picker-table td, .key-value-table td, .service-cost-table td {
  padding: 0.4rem 0.4rem;
}

.file-picker-table th, .key-value-table th, .service-cost-table th {
  padding: 0.4rem 0.4rem;
  text-align: center;
}

.file-picker-table tr td:first-child, .key-value-table tr td:first-child, .service-cost-table tr td:first-child {
  width: 10px !important;
  padding: 0;
}

.file-picker-table .handle, .key-value-table .handle, .service-cost-table .handle {
  float: left;
  cursor: move;
  left: 20px;
  width: 1.75rem;
  height: 60px;
  padding: 0 5px;
}

.file-picker-table .handle:hover, .key-value-table .handle:hover, .service-cost-table .handle:hover {
  background-color: #d8d8d8;
  color: white;
}
.file-picker-table .handle:hover tr, .key-value-table .handle:hover tr, .service-cost-table .handle:hover tr {
  background-color: red;
}

.file-picker-table tr:has(.handle:hover), .key-value-table tr:has(.handle:hover), .service-cost-table tr:has(.handle:hover) {
  transform: translateY(-2px);
  box-shadow: 0 3px 10px 0 #ebe9f1;
  transition: all 0.2s;
  z-index: 1;
}

input[type=color] {
  height: 2.8rem;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
  margin-right: 5px;
  font-size: 26px;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  font-size: 15px;
}

.flatpickr-current-month input.cur-year {
  font-size: 15px;
}