/*
Template Name: Velzon - Admin & Dashboard Template
Author: Themesbrand
Website: https://themesbrand.com/
Contact: support@themesbrand.com
File: Custom Css File
*/
h1,
h2,
h3,
h4,
h5,
h6 {
  word-break: break-word;
}
/* .dataTables_wrapper {
  width: 100%;
  overflow-x: auto;
} */

.dataTables_wrapper table {
  width: 100% !important;
  margin: 0 !important;
}

/* Force table cells to have consistent widths */
/* .dataTables_wrapper th, */
.dataTables_wrapper td {
  white-space: normal !important;
  box-sizing: border-box !important;
  padding: 8px !important;
}

/* Ensure header cells don't resize independently */
.dataTables_wrapper thead th {
  position: relative !important;
  background-clip: padding-box !important;
}

/* Fix for header/body alignment */
.dataTables_scrollHead,
.dataTables_scrollBody {
  width: 100% !important;
}

/* Make sure content wraps properly */
.dt-nowrap div {
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis;
}

.float-right {
  float: right;
}

.float-end {
  float: inline-end;
}

.mandatory::after,
.required::after {
  content: "*";
  font-size: 16px;
  margin-left: -1px;
  color: #F05153;
  line-height: 0;
}

.form-label {
  color: black;
}

.error {
  color: red;
}

.color-light {
  color: #98a7b5;
}

.bg-unset {
  background-color: unset;
}

.select-driver {
  background-color: rgba(141, 141, 141, 0.2);
}

.badge-blue02 {
  color: #9292ea;
  background-color: rgba(25, 37, 233, 0.1);
}

.auth-one-bg .bg-overlay {
  background: linear-gradient(to right, #00003f, #000040);
  opacity: 4.7;
}

.btn.btn-icon-sm {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(1rem + 0.5em);
  width: calc(1rem + 0.5em);
}

.btn-navy-blue {
  background-color: #000040;
  border-color: #000040;
  color: #fff;
}

.btn-navy-blue:hover {
  color: #fff;
  background-color: #000040;
  border-color: #000040;
}

.btn-primary {
  background-color: #0a215f;
  border-color: #0a215f;
  color: #fff;
}

/* .paginate_button {
  background-color: #000040;
  border-color: #000040;
} */

.btn-group.custom-btn-group {
  border-radius: 1rem;
}

.btn-group.custom-btn-group .btn {
  border: none;
  min-width: 6rem;
  padding: 0.75rem 1rem;
  cursor: pointer;
  margin: 0;
  box-shadow: inset 0px 0px 0px -15px #415289;
  transition: all 300ms ease-out;
}

.btn-group.custom-btn-group .btn:last-child {
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.btn-group.custom-btn-group .btn:first-child {
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}

.btn-group.custom-btn-group .btn:hover,
.btn-group.custom-btn-group .btn:focus {
  color: #415289;
  /* box-shadow: inset 0px -20px 0px -15px #415289; */
}

.btn-group.custom-btn-group .btn:focus {
  outline: none;
}

.btn-group.custom-btn-group .btn:after {
  content: '✔️';
  margin-left: 0.5rem;
  display: inline-block;
  color: #415289;
  position: absolute;
  transform: translatey(10px);
  opacity: 0;
  transition: all 200ms ease-out;
}

.btn-group.custom-btn-group .btn.active:after {
  opacity: 1;
  transform: translatey(-2px);
}

.btn-primary:hover {
  color: #fff;
  background-color: #0a215f;
  border-color: #0a215f;
}

.btn.btn-back {
  height: 21px;
}

.dropdown-item.remove-item-btn.remove-user {
  cursor: pointer;
}

.swal2-confirm.btn.btn-success {
  background-color: #0a215f;
  border-color: #0a215f;
  color: #fff;
}

.dropdown-item.remove-item-btn.remove-experience {
  cursor: pointer;
}

.dropdown-item.remove-item-btn.remove-user-document {
  cursor: pointer;
}

.card.border.card-border-primary.update-stage-badge {
  cursor: point-er;
}

.card-item.location .location-start::before {
  content: '';
  position: absolute;
  height: 84%;
  border: 1px dashed #98a7b5;
  left: 8px;
  top: 24px;
  z-index: 0;
}

.cursor-pointer {
  cursor: pointer;
}

.ml-1 {
  margin-left: 20px;
}

.d-none {
  display: none;
}

th,
td {
  text-align: left !important;
}


.auth-logo {
  max-width: 200px;
  height: 100px;
  width: 200px;
}

.offer-image {
  width: 200px;
  height: auto;
  max-height: 260px;
  object-fit: cover;
}

.vehicle-type-image img {
  width: 100px;
  height: 100px;
  border-radius: 4px;
  object-fit: cover;
  margin-top: 6px;
}

.profile-user .remove-image {
  border-radius: 28px;
  width: 28px;
  height: 28px;
  position: absolute;
  right: 2px;
  top: 2px;
  align-items: center;
  justify-content: center;
}

.profile-user .remove-image i {
  font-size: 14px;
  line-height: 14px;
}

.btn.btn-secondary {
  background-color: #a6aaaf;
  border-color: #a6aaaf;
}

.btn.btn-secondary:hover,
.btn.btn-secondary:focus,
.btn.btn-secondary:active {
  background-color: #8f9399;
  border-color: #8f9399;
}

.btn.btn-round {
  width: 20px;
  height: 20px;
  background-color: #f3f6f9;
  border: 1px solid #9e9eeb;
  color: #9e9eeb;
}

.btn.btn-round.active {
  background-color: green;
  border-color: green;
  color: #fff;
}

.btn.btn-primary:focus {
  color: #fff;
}

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

.w60 {
  width: 60px;
}

/* Sidebar */
.logo .logo-lg {
  display: inline-block;
}

.logo .logo-lg img {
  padding: 10px 0 0;
}

@media (max-width: 767.98px) {

  .navbar-brand-box,
  [data-layout=vertical] .navbar-brand-box {
    display: block;
    padding: 0;
  }

  .navbar-brand-box .logo,
  [data-layout=vertical] .navbar-brand-box .logo {
    padding: 0;
  }

  .navbar-brand-box .logo .logo-sm img {
    height: 32px;
  }

  .app-menu.navbar-menu .navbar-brand-box .logo .logo-sm {
    display: block;
    text-align: left;
    padding: 0 20px;
  }

  .app-menu.navbar-menu .navbar-brand-box .logo .logo-sm img {
    height: 64px;
  }
}

.flatpickr-month .flatpickr-current-month {
  font-size: 100%;
}

.select2.select2-container.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: #0a215f;
  border-color: #0a215f;
  color: #ffffff;
}

.select2.select2-container.select2-container--default .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove {
  color: #ffffff;
  transition: 0.3s ease all;
}

.select2.select2-container.select2-container--default .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove:hover,
.select2.select2-container.select2-container--default .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove:focus {
  color: #0a215f;
}

.avatar-xxs {
  height: 3rem;
  width: 3rem;
}

.avatar-xxs img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.text-reset.d-block.dropdown-item.position-relative.mb-2.cursor-pointer.notification-update {
  padding-top: 10px;
}

.dropdown-item {
  white-space: unset;
}

.notif-bg {
  background: #dddfe5;
}

.align-end {
  align-items: self-end;
  justify-content: end;
}

.text-lowercase {
  text-transform: lowercase;
}

.view-all .btn:hover {
  color: var(--vz-btn-hover-color);
  background-color: #000040;
  border-color: var(--vz-btn-hover-border-color);
}

.user-name-text {
  white-space: nowrap;
  width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.drop-down-text {
  white-space: nowrap;
  width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.word-wrap {
  white-space: -moz-pre-wrap !important;
  /* Mozilla, since 1999 */
  white-space: -webkit-pre-wrap;
  /* Chrome & Safari */
  white-space: -pre-wrap;
  /* Opera 4-6 */
  white-space: -o-pre-wrap;
  /* Opera 7 */
  white-space: pre-wrap;
  /* CSS3 */
  word-wrap: break-word;
  /* Internet Explorer 5.5+ */
  word-break: break-all;
  white-space: normal;
}

table tr td:first-child {
  max-width: 150px;
  word-break: break-word !important;
  white-space: initial !important;
}

table tr td.text-nowrap {
  white-space: nowrap !important;
  word-break: keep-all !important;
}


table tr td:nth-child(4) {
  max-width: 150px;
  word-break: break-word !important;

  white-space: initial !important;
}

table tr td:nth-child(4) a {
  white-space: nowrap !important;
}

.align-rgt {
  text-align: right;
}

table tr td:first-child * {
  word-break: break-word !important;
  white-space: initial;
}

table tr td:nth-child(4) * {
  word-break: break-word !important;
  white-space: initial;
}

.vehicle-type-view {
  padding: 27px;
}

.fc-button-group .fc-next-button::before,
.fc-button-group .fc-prev-button::before {
  opacity: 0;
}

.fc-button-group button span {
  left: 0;
  right: 0;
  margin: auto !important;
}

.fc-right button {
  display: block !important;
}

.leave-info-width {
  min-width: 100px;
}

.cursor-auto {
  cursor: auto;
}

.fs-27 {
  font-size: 29px;
}

.fs-24 {
  font-size: 24px;
}

.fs-18 {
  font-size: 18px;
}

.fs-16 {
  font-size: 16px;
}

.fs-14 {
  font-size: 14px;
}

.fs-12 {
  font-size: 12px !important;
}

/* Disable Bootstrap's select input styles for mtz-monthpicker */
select.ui-datepicker-month,
select.ui-datepicker-year {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding-left: 9px;

}

.ui-datepicker-calendar {
  display: none;
}

.ui-datepicker-year {
  z-index: 99999 !important;
}

.btn-active {
  background: #000040;
  color: white;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  color: #fff;
  background-color: #000040;
  border-color: var(--vz-nav-tabs-link-active-border-color);
}

.nav-tabs .nav-link {
  margin-bottom: calc(-1 * var(--vz-nav-tabs-border-width));
  background: #c1c1de;
  border: var(--vz-nav-tabs-border-width) solid transparent;
  border-top-left-radius: var(--vz-nav-tabs-border-radius);
  border-top-right-radius: var(--vz-nav-tabs-border-radius);
}

.pac-container {
  z-index: 100000;
}

/*the container must be positioned relative:*/
.autocomplete {
  position: relative;
  display: inline-block;
}


.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}

.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #e9e9e9;
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important;
  color: #ffffff;
}

.nav-tabs {
  --vz-nav-tabs-border-width: 1px;
  --vz-nav-tabs-border-color: none;
  --vz-nav-tabs-border-radius: 0.25rem;
  --vz-nav-tabs-link-hover-border-color: var(--vz-gray-300) var(--vz-gray-300) var(--vz-gray-300);
  --vz-nav-tabs-link-active-color: #495057;
  --vz-nav-tabs-link-active-bg: var(--vz-nav-tabs-link-active-bg);
  --vz-nav-tabs-link-active-border-color: var(--vz-gray-300) var(--vz-gray-300) var(--vz-nav-tabs-link-active-bg);
  border-bottom: var(--vz-nav-tabs-border-width) solid var(--vz-nav-tabs-border-color);
}

#floating-panel {
  position: absolute;
  top: 10px;
  left: 25%;
  z-index: 5;
  background-color: #fff;
  padding: 5px;
  border: 1px solid #999;
  text-align: center;
  font-family: "Roboto", "sans-serif";
  line-height: 30px;
  padding-left: 10px;
}

#gmaps-markers {
  height: 395px;
}

.mt-27 {
  margin-top: 27px !important;
}

.nav-highlight {
  height: 50px;
}

.step-arrow-nav .nav .nav-highlight.active {
  background-color: rgba(0, 0, 64, 0.85);
  color: #fff;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 1px solid rgba(0, 0, 64, 0.85);
}

.step-arrow-nav .nav .nav-highlight {
  border-radius: 0;
  position: relative;
  font-weight: 500;
  color: #fff;
  background: #35366d70;
  border: 1px solid #c7d6dd;
}

.text-underline {
  text-decoration: underline;
}

.day-hire-img {
  display: block;
  max-width: 220px !important;
  padding: .5rem .9rem;
  font-size: .8125rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--vz-body-color);
  background-color: var(--vz-input-bg);
  background-clip: padding-box;
  border: 1px solid var(--vz-input-border);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: .25rem;
  -webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
  transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
  max-height: 150px !important;
}

.accordion-primary .accordion-item {
  border-color: rgb(10, 33, 95);
  border-top-color: rgb(10, 33, 95);
  border-right-color: rgb(10, 33, 95);
  border-bottom-color: rgb(10, 33, 95);
  border-left-color: rgb(10, 33, 95);
}

datalist option {
  background-color: #000027;
}

.height_300 {
  height: 300px;
}

.border-secondary.table>thead {
  border-color: #283c73 !important;
}

.border-secondary.table>tbody {
  border-color: #283c73 !important;
}

.checklist-status {
  font-size: 20px;
  padding-left: 2px;
}

.icon-holder {
  height: 64px;
  width: 64px;
  min-width: 64px;
  background-color: rgba(255, 255, 255, 0.1);
}

.icon-holder i.truck {
  color: #5e5ee9;
}

.icon-holder i.van {
  color: #57c923;
}

.side-list {
  min-width: 200px;
  height: 100%;
}

.vis-panel {
  cursor: move;
}

.card.card-list {
  position: relative;
  /* background-color: #f6f6f9; */
  /* box-shadow: none; */
}

/* .card-list.active{
    background-color: #ffffff;
    box-shadow: 1px 1px 8px rgba(255, 255, 255, 0.9), 1px 1px 8px rgba(79, 138, 255, 0.14);
  } */
/* .card-list.active::after{
    content: '';
    position: absolute;
    border: 1px solid #9292ea;
    height: calc(100% - 30px);
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  } */


.card-list.selected {
  border: 2px solid #09da59 !important;
  background-color: #d6e8da !important;
}

.card-list.active {
  border: 2px solid #9292ea !important;
  background-color: #e0e0ea !important;
}

.start-point::before {
  content: '';
  position: absolute;
  border: 1px dashed #98a7b5;
  height: 100%;
  left: 6px;
  top: 18px;
}

.booking-container {
  height: calc(100vh - 176px);
}

.booking-container .job-tool-container {
  height: 50%;
  flex-grow: 1;
}

@media (max-width:992.98px) {
  .booking-container .job-tool-container {
    height: 100%;
  }
}

.m-b-2 {
  margin-bottom: 31px;
}

/* PLANNING TOOL - TIMELINE */
.timeline-area .jqTimepsaceContainer {
  height: 100%;
}

.timeline-area .jqTimepsaceContainer .jqTimespaceDisplay {
  /* event blocks */
  display: none !important;
}

.timeline-area .jqTimespaceDataContainer {
  border-color: #dfe1e3 !important;
  height: 100%;
  max-height: 100% !important;
}

.timeline-area .jqTimepsaceContainer .jqTimespaceLeft,
.timeline-area .jqTimepsaceContainer .jqTimespaceRight {
  border-radius: 5px;
  font-size: 12px;
  background-color: rgba(25, 37, 233, 0.1);
  color: #9292ea;
  border-color: #9292ea;
  bottom: 40%;
}

.timeline-area .jqTimespaceDataContainer aside.jqTimespaceAnimated {
  height: 100%;
}

.timeline-area .jqTimespaceDataContainer aside.jqTimespaceAnimated header div:first-child {
  display: none !important;
}

.vis-labelset {
  background-color: #f3f6f9;
  min-width: 200px;
}

.vis-inner {
  width: 100%;
  padding: 0px !important;
  height: 100%;
}

.vis-label,
.vis-group {
  min-height: 105px;
}

.side-list.selected {
  background-color: #cff6c7 !important;
}

.assign-modal {
  --vz-modal-width: 950px;
}

.accordion-button.hide-arrow::after {
  display: none;
}

.timline-view {
  max-height: calc(100vh - 275px);
  padding-bottom: 1rem;
  height: 100%;
}

.timline-view-tile {
  max-height: calc(100vh - 345px);
}

.timline-view-tile>div {
  margin-bottom: 1rem;
}

.alert-active {
  background-color: rgb(255, 221, 221);
  color: rgb(255, 0, 0);
}

.alert-active:hover {
  background-color: rgb(243, 191, 191);
  color: rgb(201, 9, 9);
}


@media(max-width: 990px) {
  .timline-view {
    height: auto;
  }

  .timline-view-tile>div:nth-last-child(2),
  .timline-view-tile>div:last-child {
    margin-bottom: 0 !important;
  }

  .timline-view-tile {
    max-height: 330px;
  }
}

@media(max-width: 575px) {
  .logo {
    width: 100%;
    padding: 10px;
  }

  [data-layout="vertical"] .horizontal-logo {
    display: block;
  }

  td {
    word-break: break-word;
    white-space: initial;
    text-align: left;
  }

  th ul {
    text-align: left !important;
  }

  td ul,
  th ul {
    white-space: initial;
  }
}

@media(max-width: 575px) {
  .logo {
    width: 100%;
    padding: 10px;
  }

  [data-layout="vertical"] .horizontal-logo {
    display: block;
  }

  td {
    word-break: break-word;
    white-space: initial;
    text-align: left;
  }

  th ul {
    text-align: left !important;
  }

  td ul,
  th ul {
    white-space: initial;
  }

  .mob-text {
    word-break: initial;
  }

  .topbar-badge {
    right: -16px;
  }

  .checklist-img img {
    max-height: 350px;
  }

  .timline-view-tile>div:nth-last-child(2),
  .timline-view-tile>div:last-child {
    margin-bottom: 1rem !important;
  }
  .ribbon-box.right .ribbon {
    position: relative;
    right: -17px;
    font-size: .6rem;
  }
  .footer {
    position: fixed;
  }
  .booking-details-view {
    padding-bottom: 4rem !important;
  }

  .loading-image {
    position: fixed;
    top: 50%;
    left: 50%;
    text-align: center;
    z-index: 2;
  }

  .loader {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 5000;
    background-color: rgba(255, 255, 255, 0.5);
    align-items: center;
    justify-content: center;

  }


  .vis-item {
    z-index: 999;
  }

  .vis-delete {
    display: none !important;
  }

  .chat-conversation .right .conversation-list .ctext-wrap .ctext-wrap-content {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    background-color: rgba(var(--vz-success-rgb), .15);
    color: #0a6cb3;
    text-align: left;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .chat-message-head {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    margin-bottom: 27px;
    text-align: center;
    color: #787885 !important;
  }

  .chat-message-head span {
    white-space: nowrap;
    margin: 0 10px;
    font-size: 14px;
    display: inline-block;
    color: #787885 !important;
  }

  .chat-message-head::before,
  .chat-message-head::after {
    display: inline-block;
    width: 100%;
    height: 1px;
    content: "";
    background-color: #d9d9e1 !important;
  }

  .start-day-hire::before {
    display: none !important;
  }

  .chat-list>li.active a {
    background-color: #6969f187;
    color: #000040;
  }

  .chat-no-data {
    width: 100%;
  }

  .centered-text {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
  }

  .chat-time {
    font-size: 11px;
    color: gray;
  }

  .job-rejected {
    background-color: #e8c6bc !important;
  }

  .horizontal-timeline .swiper-slide .timeline-content {
    background-color: #f1f1f4;
  }

  .horizontal-timeline::before {
    content: "";
    position: absolute;
    width: 100%;
    top: 174px;
    left: 0;
    height: 2px;
    background-color: #405189;
  }

  .customer-chat-img {
    max-width: 100%;
    height: 48px;
    width: 48px;
    object-fit: contain;
  }



  .mob-text {
    word-break: initial;
  }

  .topbar-badge {
    right: -16px;
  }

  .checklist-img img {
    max-height: 350px;
  }

  .timline-view-tile>div:nth-last-child(2),
  .timline-view-tile>div:last-child {
    margin-bottom: 1rem !important;
  }
}

@media(max-width: 480px) {
  #invoice-generated-chart {
    min-height: 250px !important;
  }
  #invoice-generated-chart .apexcharts-canvas {
    height: 250px !important;
  }
  #invoice-generated-chart .apexcharts-canvas svg {
    height: 250px !important;
  }
  #invoice-generated-chart foreignObject {
    height: 200px !important;
  }
  #invoice-generated-chart .apexcharts-datalabels-group{
    transform: translateY(70px) scale(.8);
    transform-origin: center top;
  }

}

.loading-image {
  position: fixed;
  top: 50%;
  left: 50%;
  text-align: center;
  z-index: 2;
}

.loader {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5000;
  background-color: rgba(255, 255, 255, 0.5);
  align-items: center;
  justify-content: center;

}

.vis-item {
  z-index: 999;
}

.vis-delete {
  display: none !important;
}

.chat-conversation .right .conversation-list .ctext-wrap .ctext-wrap-content {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  background-color: rgba(var(--vz-success-rgb), .15);
  color: #0a6cb3;
  text-align: right;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.chat-message-head {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 27px;
  text-align: center;
  color: #787885 !important;
}

.chat-message-head span {
  white-space: nowrap;
  margin: 0 10px;
  font-size: 14px;
  display: inline-block;
  color: #787885 !important;
}

.chat-message-head::before,
.chat-message-head::after {
  display: inline-block;
  width: 100%;
  height: 1px;
  content: "";
  background-color: #d9d9e1 !important;
}

.start-day-hire::before {
  display: none !important;
}

.chat-list>li.active a {
  background-color: #6969f187;
  color: #000040;
}

.chat-no-data {
  width: 100%;
}

.centered-text {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.chat-time {
  font-size: 11px;
  color: gray;
}

.job-rejected {
  background-color: #e8c6bc !important;
}

.horizontal-timeline .swiper-slide .timeline-content {
  background-color: #f1f1f4;
}

.horizontal-timeline::before {
  content: "";
  position: absolute;
  width: 100%;
  top: 174px;
  left: 0;
  height: 2px;
  background-color: #405189;
}

.timeline-2 {
  background: aliceblue
}

.issue-raise-link {
  color: blue;
  font-weight: 600;
}

.new-chat {
  background-color: #a9acbede;
  color: white;
}

.Stars {
  --percent: calc(var(--rating) / 5 * 100%);
  display: inline-block;
  font-size: 20px;
  font-family: Times;
  line-height: 1;
}

.Stars::before {
  content: '★★★★★';
  letter-spacing: 3px;
  background: linear-gradient(90deg, #fc0 var(--percent), #fff var(--percent));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.rating-value {
  font-size: 20px;
  font-weight: bold;
  margin-right: 10px;
}

.form-check-input:disabled~.form-check-label,
.form-check-input[disabled]~.form-check-label {
  color: #444;
  /* Replace #444 with the darker color you want */
  opacity: 1.6;
}

.job-img {
  max-width: 5.75rem;
  height: 5.75rem;
  object-fit: cover;
  width: 5.75rem;
  min-height: 5.75rem;
}

.reported-img {
  height: 150px;
  width: 150px;
  object-fit: cover;
}
.text-link{
    color: #000040;
    text-decoration: underline;
}
.overall-filter{
  padding: 1rem;
border: 1px aliceblue solid;
}

.border-grey {
  border-color: #c5c5c6 !important;
}

.red-background {
  background-color: #FF0000;
}

.amber-background {
  background-color: #FFBF00;
}

.new-quote-background {
  background-color: #339de6;
}

/* Basic styling for the list */
.custom-modal-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Style for each list item */
.custom-modal-list li {
  padding: 5px 0;
  border-bottom: 1px solid #ccc;
}

/* Adding some spacing to the last item */
.custom-modal-list li:last-child {
  border-bottom: none;
  margin-bottom: 10px;
}

.pricing-map {
  min-height: 350px !important;
}

.bg-blue-text-white {
  color: #ffffff !important;
  background-color: #405189;
}
.back-button-style{
  display: flex;
align-items: center;
}
.pale-blue{
  color: #359CE6;
}
.justify-content-sb{
  justify-content: space-between;
}
/* Style the input container */

.flatpickr-input-group {
  position: relative;
  width: 100%;
}
.flatpickr-wrapper{
    width: 100%;
}

/* Style the clear icon */
.clear-icon {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  cursor: pointer;
  color: #999; /* Customize the color as needed */
}

.clear-icon:hover {
  color: #ff0000; /* Customize the hover color as needed */
}
/* NOTIFICATION LOADER */
  .notification-loader {
    position: absolute;
    width: 100%;
    height: -webkit-fill-available;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
  }
/* ===================== */
/* TAB MENU STYLE */
.nav-tabs-custom .nav-item{
    flex-basis: auto !important;
}

/* ==================== */
/* INVOICE TABLE CSS */
.invoice-table{
    /* background-color: #fff;
    max-width: 100%;
    width: 43.75rem;
    height: 100%;
    margin-left: auto;
    margin-right: auto; */
}
.table-para{
    min-width: 8.75rem;
    max-width: 8.75rem;
    word-break: break-word;
}

/* =================== */
/* BILL REQUEST */
.bill-request .card .card-body{
    border-top: 3px solid #0a215f;
}
/* ============== */
.w-120{
  width: 120px;
}

.fs-45{
  font-size: 45px;
}

.dashboard-avatar-title {
  align-items: center;
  background-color: #000040;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: 500;
  height: 100%;
  justify-content: center;
  width: 100%;
}
.ml-10{
  margin-left: 10px;
}
.map-marker-distance{
  background-color: white;
}
.mt-40{
    margin-top: 43px;
}
.ui-datepicker .ui-datepicker-title select {
  float: left;
  font-size: 1em;
  margin: 1px 0;
  pointer-events: none;
}

.pod-preview-modal, .booking-img-preview-modal-body {
  text-align: center;
  position: relative;
  overflow-y: auto; /* Allow vertical scrolling if the image is taller than the modal */
  max-height: 70vh; /* Constrain the modal height to fit within the viewport */
  padding: 1rem;
}
.image-box{
    width: 100%;
    height: 26.25rem;
    max-height: 26.25rem;
    overflow: hidden;
    background-color: #000000;

}
#modalImage, #jobmModalImage {
  max-width: 100%;
  max-height: 100%;
  transition: transform 0.3s ease;
  object-fit: contain;
  object-position: center center;
  width: 100%;
  height: 100%;
}

.zoom-controls, .booking-zoom-controls {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  display: flex;
  border-radius: 2px;
  overflow: hidden;
}
.zoom-controls, .booking-zoom-controls button:first-child{
    border-right: 1px solid #000027;
}

.zoom-controls button, .booking-zoom-controls button {
  width: 1.5rem;
  height: 1.5rem;
  background-color: #fff;
  color: #000027;
  font-size: 1rem;
  font-weight: 500;
  padding: 0;
  border: 0;
}
.mt-65{
  margin-top: 3.5rem !important;
}
/*  Developed by shafi jahangeer
    Developed date: 20/1/2025 */
.text-red{
    color: #f06548;
}
.text-green{
    color: #0ab39c;
}
.text-base{
    font-size: 1rem;
}
.select2-container .select2-selection--single{
    height: 37.1px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: 36px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 100% !important;
    top: -1px !important;
}
.select2-container--default .select2-selection--single .select2-selection__clear{
    height: 100% !important;
}
/* ================== */

.map-show-distance{
  background-color: hsl(231, 37%, 96%);
}
.bg-f5f5f5{
    background-color: #f5f5f5;
}
.p-20px {
    padding: 1.25rem !important;
}
/* page content padding update */
/* .page-content{
    padding: calc(150px + 1.5rem) calc(1.5rem * .5) 60px calc(1.5rem * .5) !important;
} */
.page-conent{

  padding:calc(70px + 1.5rem) calc(1.5rem  .5) 60px calc(1.5rem  .5) !important;
  
  }
/* ================ */

.bg-red {
  --vz-bg-opacity: 1;
  background-color: rgb(240, 47, 7) !important;
}

.start-16 {
  left: 16% !important;
}

.user-chat{
  visibility: visible !important;
}
.ml-600{
  margin-left: 135px;
}
.add-cc-bcc {
  cursor: pointer;
  color: #405189;
  text-decoration: underline;
  transition: color 0.2s ease-in-out;
}

.add-cc-bcc:hover {
  color: #0a58ca;
  text-decoration: underline;
}
/* .dataTables_wrapper .dropup .dropdown-menu {
  top: auto !important;
  bottom: 100% !important;
  transform: translateY(-5px) !important;
} */