/* .dropdown.dropdown-hover .dropdown-menu, .dropdown .dropdown-menu{
  display: unset !important;
} */
/* .form-control:focus {
  box-shadow: unset;
  border-color: #d2d6da;
} */
/* .dropdown .dropdown-toggle::after, .dropup .dropdown-toggle::after {
  content:unset !important;
} */

#dropdownContent {
  display: none;
  z-index: 9;
  position: absolute;
  background: #fff;
  box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.15);

}

.dropdown-menu {
  min-width: 0 !important;
  width: auto !important;
}

#date {
  width: 150px;
  outline: none;
  border: 1px solid #aaa;
  padding: 6px 28px;
  color: #aaa;
}

.dropdown-menu.dropdown-click {
  pointer-events: auto !important;
}

.dropdown-menu.dropdown-click a {
  pointer-events: auto !important;
}

/* .date-container {
  position: relative;
  float: left;
  .date-text {
    position: absolute;
    top: 6px;
    left: 12px;
    color: #aaa;
  }
  
  .date-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    color: #aaa;
  }
} */


/* input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    display: none !important;
    -webkit-appearance: none;
} */
/* Customize the appearance of the input field */
/* input[type="date"] {
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 5px;
  color: #333;
  font-family: Arial, sans-serif;
  font-size: 14px;
} */
.custom-dropdown .dropdown-toggle::before {
  content: "" !important;
}

.custom-dropdown .dropdown-toggle::after {
  display: none !important;
}

.custom-dropdown .dropdown-menu {
  box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.15);
  padding: 0;
  width: auto !important;
  /* Allow the menu to adjust its width */
  left: 0 !important;
  min-width: 0;
}

.stage_dropdown .dropdown-toggle {
  background: #fff;
  display: inline-block;
  /* Display the button as an inline block */
}

.custom-dropdown .dropdown-menu .dropdown-item {
  font-size: 10px;
  font-weight: 400;
  color: rgba(52, 71, 103, 1);
}

.custom-dropdown .dropdown-item:hover, .dropdown-item:focus {
  background: rgb(220, 220, 220) !important;
}

/* .dot-dropdown .dropdown-toggle::after {
  content: none !important;
}

.dot-dropdown .dropdown-menu {
  min-width: 2rem;
  box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.15);
  padding: 0;
}

.dot-dropdown .dropdown-menu .dropdown-item {
  font-size: 10px;
  font-weight: 400;
  color: rgba(52, 71, 103, 1);
}

.dot-dropdown .dropdown-item:hover, .dropdown-item:focus {
  background: rgb(220, 220, 220) !important;
}

.btn:hover:not(.btn-icon-only) {
  box-shadow: unset !important;
  transform: unset !important;
} */

/* .timeline-one-side .timeline-content {
  max-width: unset !important;
}

.navbar-brand-img {
  width: 80% !important;
  height: auto !important;
}

.navbar-vertical .navbar-brand>img, .navbar-vertical .navbar-brand-img {
  max-width: unset !important;
  max-height: unset !important;
}

#sidenav-main {
  background-color: #fff;
}

.navbar-vertical .navbar-nav .nav-link.active {
  box-shadow: unset !important;
}

.navbar-vertical .navbar-nav>.nav-item .nav-link.active .icon {
  background-image: linear-gradient(310deg, #fbcf33 0%, #fbcf33 100%) !important;
}

.nav-link .icon-shape {
  background-color: #E9ECEF !important;
}

.bg-gradient-info {
  background-image: linear-gradient(120deg, #2152ff 28%, #4ab2fe 100%) !important;
}

.icon-shape {
  display: flex;
  justify-content: center;
  align-items: center;
} */

.sel_entries {
  display: flex;
  width: auto;
  height: 100%;
  align-items: center;
}

.sel_entries .dropdown_label {
  color: #A7A7A7;
  font-size: 10px;
  font-weight: 400;
}

.filter_btn {
  background: #2152ff !important;
  /* color:#fff; */
  padding: 8px 15px !important;
  border-radius: 7px !important;
  margin-left: 25px;
  display: flex !important;
  align-items: center;
}

.filter_btn .btn-inner--text {
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  margin-left: 5px;
}

.booking-light-timeline {
  position: relative;
}

.booking-light-timeline .booking_id {
  color: #344767;
  font-size: 14px;
}

.state_label {
  width: 66px;
  height: 21px;
  border-radius: 10px;
  background: #FFF7E2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.state_label p {
  font-size: 10px;
  color: #FAC234;
  font-weight: 600;
  margin-bottom: 0px;
}

.booking_id .booking_id_span {
  font-size: 17px;
  font-weight: 700;
  margin-left: 10px
}

.booking-light-timeline .progress-bar {
  background-color: #2152ff !important;
  height: 8px !important;
}

.booking-light-timeline .progress {
  background: rgb(191, 203, 248) !important;
  height: 6px !important;
}

.booking-light-timeline .timeline-content p {
  color: #344767;
}

.booking-light-timeline .timeline::before {
  left: 9rem !important;
}

.booking-light-timeline .timeline-step {
  left: 9rem !important;
  width: 11px !important;
  height: 11px !important;
  background: #344767 !important;
}

.booking-light-timeline .timeline-content {
  margin-left: 0px !important;

}

.booking-light-timeline .timeline-content p {
  color: #344767 !important;
  font-size: 10px;
  font-weight: 400;
}

.booking-light-timeline .timeline::before {
  /* height:auto !important; */
  border-color: #344767 !important;
  top: 13px !important;

}

.booking-light-timeline .timeline:nth-child(2)::before {
  border-right: 0px !important;
}

.booking-light-timeline .custom-timeline {
  position: relative;
}

.booking-light-timeline .custom-timeline::before {
  content: '';
  position: absolute;
  top: 13px;
  /* height:50px !important; */
  border: 1px dotted #D9D9D9;
  /* Apply the style to the custom-timeline class */
  left: 6rem;
}

.booking-light-timeline .timeline-one-side .custom-timeline::before {
  left: 1rem !important;
}

.booking-light-timeline .timeline-step {
  top: 4px;
}

.booking--timeline .custom-timeline-step {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* left: 0;
  width: 26px;
  height: 26px; */
  border-radius: 50%;
  background: #fff;
  text-align: center;
  transform: translateX(-50%);
  font-size: 1rem;
  font-weight: 600;
  z-index: 1;
  top: 4px;
  left: 6rem !important;
  width: 11px !important;
  height: 11px !important;
  border: 1px solid #A7A7A7 !important;
}

.booking-light-timeline .custom-timeline.no-line::before {
  content: none;
  /* Hide the line */
}

.booking-light-timeline .timeline-time {
  display: flex;
  justify-content: end;
}

.booking-light-timeline .timeline-time span {
  font-size: 12px;
  font-weight: 600;
  color: #344767;
}

.booking-light-timeline .booked-on span {
  font-size: 12px;
  color: #2152FF;
  font-weight: 600;
}

.booking-light-timeline .booked-on-date span {
  font-size: 12px;
  color: #2152FF;
  font-weight: 600;
  display: flex;
  justify-content: end;
}

.booking-white-timeline .timeline {
  position: relative;
}

.booking-white-timeline .timeline::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 9rem;
  height: calc(100% - 0px);
  border-right: 2px solid #344767 !important;
}

.booking-white-timeline .timeline-block {
  position: relative;
  margin-bottom: 20px;
  /* Adjust as needed */
}

.booking-white-timeline .timeline-step {
  position: absolute;
  left: 9rem !important;
  top: 4px;
  width: 10px;
  /* Size of the dot */
  height: 10px;
  /* Size of the dot */
  background-color: #344767 !important;
  /* Color of the dot */
  border-radius: 50%;
  /* Make it a circle */
}

.booking-white-timeline .timeline-content {
  margin-left: 0px;
  /* Adjust to create space between dot and content */
}

.booking-timeline .timeline-content p {
  color: #344767;
  /* font-weight: bold; */
}

.booking-white-timeline .timeline-content .timeline_add {
  font-size: 12px;
  font-weight: 600;
  color: #344767;
  /* text-align: end; */
  margin-bottom: 0rem !important;
  word-break: break-all;
}

/* .booking-white-timeline.timeline:nth-last-child(2)::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 8rem;
  height: calc(100% - 0px); 
  border-right: 2px dotted #A7A7A7!important;
} */
.booking-white-timeline:last-child .timeline-block .timeline-step {
  border: 2px solid #A7A7A7 !important;
  /* Add a border to the last .timeline-step within the last .booking_info_timeline */
  background-color: #fff !important;
}

.booking-white-timeline.timeline:last-of-type::before {
  display: none !important;
}

.booking_pickup {
  font-size: 10px;
  font-weight: 400;
  color: #34476799;
  margin-bottom: 0px;
}

.booking_add_driver {
  width: 100%;
  border-top: 2px solid rgba(0, 0, 0, 0.1);
}

.driver_detail_address {
  width: 100%;
  padding: 1rem 2rem;
}

.driver_add_name_img {
  display: flex;
  align-items: center;
}

.driver_add_img {
  width: 72px;
  height: 72px;
  border-radius: 10px;
}

.driver_add_img img {
  width: 100%;
  height: auto;
  border-radius: 10px;
}

.add_driver_name {
  font-size: 14px;
  font-weight: 700;
  color: #344767;
  margin-bottom: 0px;
}

.add_driver_title {
  font-size: 10px;
  font-weight: 400;
  color: #8591A4;
  margin-bottom: 0px;
}

.vehicle_add_name_img {
  display: flex;
  align-items: center;
}

.vehicle_add_img {
  width: 110px;
  height: 73px;
  background-color: rgba(240, 240, 240, 1);
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.vehicle_add_img img {
  width: 100%;
  height: auto;
}

.add_bottom_tagline {
  background-color: rgba(79, 141, 233, 1);
  border-bottom-right-radius: 13px;
  border-bottom-left-radius: 13px;
  padding: .5rem 1.5rem;
}

.add_book_on span {
  font-size: 12px;
  font-weight: 600;
  color: rgba(242, 242, 242, 1);
}

.add_book_on_date {
  text-align: end;
}

.add_book_on_date span {
  font-size: 12px;
  font-weight: 600;
  color: rgba(242, 242, 242, 1);
}

.cancelled.booking-light-timeline .progress-bar {
  background-color: rgba(255, 33, 33, 1) !important;
  height: 8px !important;
}

.cancelled.booking-light-timeline .progress {
  background: rgb(191, 203, 248) !important;
  height: 6px !important;
}

.cancelled.booking-light-timeline .state_label {
  width: 66px;
  height: 21px;
  border-radius: 10px;
  background: rgba(255, 226, 226, 1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.cancelled.booking-light-timeline .state_label p {
  font-size: 10px;
  color: rgba(255, 33, 33, 1);
  font-weight: 600;
  margin-bottom: 0px;
}

.completed.booking-light-timeline .progress-bar {
  background-color: rgba(33, 82, 255, 1) !important;
  height: 8px !important;
}

.completed.booking-light-timeline .progress {
  background: rgb(191, 203, 248) !important;
  height: 6px !important;
}

.completed.booking-light-timeline .state_label {
  width: 66px;
  height: 21px;
  border-radius: 10px;
  background: rgba(220, 255, 221, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}

.completed.booking-light-timeline .state_label p {
  font-size: 10px;
  color: rgba(55, 234, 62, 1);
  font-weight: 600;
  margin-bottom: 0px;
}

.card.in-transit {
  background-color: #2152FF;
}

.card.in-transit .card-header {
  background-color: #2152FF;
}

.in-transit.booking-light-timeline .progress-bar {
  background-color: rgba(52, 71, 103, 1) !important;
  height: 8px !important;
}

.in-transit.booking-light-timeline .progress {
  background: rgba(39, 79, 209, 1) !important;
  height: 6px !important;
}

.in-transit.booking-light-timeline .state_label {
  width: 66px;
  height: 21px;
  border-radius: 10px;
  background: rgba(52, 71, 103, 1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.in-transit.booking-light-timeline .state_label p {
  font-size: 10px;
  color: rgba(255, 255, 255, 1);
  font-weight: 600;
  margin-bottom: 0px;
}

.in-transit.booking-light-timeline .booking_id {
  color: rgba(255, 255, 255, 1);
  font-size: 14px;
}

.in-transit.booking-light-timeline .timeline-content p {
  color: #344767;
}

.in-transit.booking-light-timeline .timeline::before {
  left: 9rem !important;
}

.in-transit.booking-light-timeline .timeline-step {
  left: 9rem !important;
  width: 11px !important;
  height: 11px !important;
  background: #344767 !important;
}

.in-transit.booking-light-timeline .timeline-content {
  margin-left: 0px !important;

}

.in-transit.booking-light-timeline .timeline-content p {
  color: rgba(255, 255, 255, 1) !important;
  font-size: 10px;
  font-weight: 400;
}

.in-transit.booking-light-timeline .timeline::before {
  /* height:50px !important; */
  border-color: rgba(255, 255, 255, 1) !important;
  top: 13px !important;
}

.in-transit.booking-light-timeline .timeline:nth-child(2)::before {
  border-right: 0px !important;
}

.in-transit.booking-light-timeline .custom-timeline {
  position: relative;
}

.in-transit.booking-light-timeline .custom-timeline::before {
  content: '';
  position: absolute;
  top: 13px;
  /* height:50px !important; */
  border: 1px dotted #D9D9D9;
  /* Apply the style to the custom-timeline class */
  left: 6rem;
}

.in-transit.booking-light-timeline .timeline-one-side .custom-timeline::before {
  left: 1rem !important;
}

.in-transit.booking-light-timeline .timeline-step {
  top: 4px;
}

.in-transit.booking--timeline .custom-timeline-step {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* left: 0;
  width: 26px;
  height: 26px; */
  border-radius: 50%;
  background: #fff;
  text-align: center;
  transform: translateX(-50%);
  font-size: 1rem;
  font-weight: 600;
  z-index: 1;
  top: 4px;
  left: 6rem !important;
  width: 11px !important;
  height: 11px !important;
  border: 1px solid #344767 !important;
}

.in-transit.booking-light-timeline .custom-timeline.no-line::before {
  content: none;
  /* Hide the line */
}

.in-transit.booking-light-timeline .timeline-time {
  display: flex;
  justify-content: end;
}

.in-transit.booking-light-timeline .timeline-time span {
  font-size: 12px;
  font-weight: 600;
  color: #344767;
}

.in-transit.booking-light-timeline .booked-on span {
  font-size: 12px;
  color: #2152FF;
  font-weight: 600;
}

.in-transit.booking-light-timeline .booked-on-date span {
  font-size: 12px;
  color: #2152FF;
  font-weight: 600;
  display: flex;
  justify-content: end;
}

.in-transit .booking-white-timeline .timeline {
  position: relative;
}

.in-transit.booking-white-timeline .timeline::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 9rem;
  height: calc(100% - 0px);
  border-right: 2px solid #344767 !important;
}

.in-transit.booking-white-timeline .timeline-block {
  position: relative;
  margin-bottom: 20px;
}

.in-transit .booking-white-timeline .timeline-step {
  position: absolute;
  left: 9rem !important;
  top: 4px;
  width: 10px;
  /* Size of the dot */
  height: 10px;
  /* Size of the dot */
  background-color: rgba(255, 255, 255, 1) !important;
  /* Color of the dot */
  border-radius: 50%;
  /* Make it a circle */
}

.in-transit .booking-white-timeline .timeline-content {
  margin-left: 0px;
  /* Adjust to create space between dot and content */
}

.in-transit.booking-timeline .timeline-content p {
  color: #344767;
  /* font-weight: bold; */
}

.in-transit .booking-white-timeline .timeline-content .timeline_add {
  font-size: 12px;
  font-weight: 600;
  color: #344767;
  /* text-align: end; */
  margin-bottom: 0rem !important;
  word-break: break-all;
}

.in-transit .booking-white-timeline:last-child .timeline-block .timeline-step {
  border: 2px solid #344767 !important;
  /* Add a border to the last .timeline-step within the last .booking_info_timeline */
  background-color: #2152FF !important;
}

.in-transit .booking-white-timeline.timeline:last-of-type::before {
  display: none !important;
}

.in-transit .booking_pickup {
  font-size: 10px;
  font-weight: 400;
  color: #34476799;
  margin-bottom: 0px;
}

.in-transit .booking_add_driver {
  width: 100%;
  border-top: 2px solid rgba(0, 0, 0, 0.1);
}

.in-transit .driver_detail_address {
  width: 100%;
  padding: 1rem 2rem;
}

.in-transit .driver_add_name_img {
  display: flex;
  align-items: center;
}

.in-transit .driver_add_img {
  width: 72px;
  height: 72px;
  border-radius: 10px;
}

.in-transit .driver_add_img img {
  width: 100%;
  height: auto;
  border-radius: 10px;
}

.in-transit .add_driver_name {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255, 255, 255, 1);
  margin-bottom: 0px;
}

.in-transit .add_driver_title {
  font-size: 10px;
  font-weight: 400;
  color: rgba(240, 240, 240, 1);
  margin-bottom: 0px;
}

.in-transit .vehicle_add_name_img {
  display: flex;
  align-items: center;
}

.in-transit .vehicle_add_img {
  width: 110px;
  height: 73px;
  background-color: rgba(240, 240, 240, 1);
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.in-transit .vehicle_add_img img {
  width: 100%;
  height: auto;
}

.in-transit .add_bottom_tagline {
  background-color: rgba(52, 71, 103, 1);
  border-bottom-right-radius: 13px;
  border-bottom-left-radius: 13px;
  padding: .5rem 1.5rem;
}

.in-transit .add_book_on span {
  font-size: 12px;
  font-weight: 600;
  color: rgba(79, 141, 233, 1);
}

.in-transit .add_book_on_date {
  text-align: end;
}

.in-transit .add_book_on_date span {
  font-size: 12px;
  font-weight: 600;
  color: rgba(79, 141, 233, 1);
}

@media only screen and (max-width:576px) {
  .booking-white-timeline .timeline-step {
    left: 7rem !important;
  }

  .booking-light-timeline .timeline::before {
    left: 7rem !important;
  }

  .in-transit .booking-white-timeline .timeline-step {
    left: 7rem !important;
  }

  .in-transit.booking-light-timeline .timeline::before {
    left: 7rem !important;
  }

  .in-transit .driver_detail_address {
    padding: 1rem 1rem;
  }
}
@media only screen and (max-width:480px){
  .vehicle_add_name_img{
    flex-direction: column;
  }
  .driver_add_name_img{
    flex-direction: column;
  }
}
@media only screen and (max-width:420px) {
  .booking-white-timeline .timeline-step {
    left: 6.5rem !important;
  }

  .booking-light-timeline .timeline::before {
    left: 6.5rem !important;
  }

  .in-transit .booking-white-timeline .timeline-step {
    left: 6.5rem !important;
  }

  .in-transit.booking-light-timeline .timeline::before {
    left: 6.5rem !important;
  }
  .driver_detail_address{
    padding: 1rem 1rem;
  }
}

@media only screen and (max-width:400px) {
  .booking-white-timeline .timeline-step {
    left: 5.5rem !important;
  }

  .booking-light-timeline .timeline::before {
    left: 5.5rem !important;
  }

  .in-transit .booking-white-timeline .timeline-step {
    left: 5.5rem !important;
  }

  .in-transit.booking-light-timeline .timeline::before {
    left: 5.5rem !important;
  }
}