/******************************************************************** Date picker ************************************************/
/* Mobile: the datepicker below is a fixed 342px wide, which overflows
   320-360px phone screens — clamp it to the viewport. */
@media only screen and (max-width: 400px) {
  #ui-datepicker-div {
    max-width: calc(100vw - 16px);
  }
  #ui-datepicker-div .ui-datepicker-calendar {
    width: 100%;
  }
}
@media only screen and (min-width: 10px) {
  #ui-datepicker-div {
    width: 342px;
    border-color: var(--wbtm_color_theme);
    padding: 0;
    background-color: #FFF;
  }

  #ui-datepicker-div .ui-datepicker-header {
    background-color: var(--wbtm_color_theme);
    background-image: none;
    border-color: var(--wbtm_color_theme);
    padding: var(--wbtm_dmp_xs);
    color: var(--wbtm_color_theme_alter);
    border-radius: 0;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    font-size: var(--wbtm_fs_h6);
  }

  #ui-datepicker-div .ui-datepicker-header .ui-icon {
    display: none;
  }

  #ui-datepicker-div .ui-datepicker-prev {
    top: var(--wbtm_dmp_xs);
    left: 5px;
    height: 30px;
    width: 30px;
  }

  #ui-datepicker-div .ui-datepicker-next {
    top: var(--wbtm_dmp_xs);
    right: 5px;
    height: 30px;
    width: 30px;
  }

  #ui-datepicker-div .ui-datepicker-prev:hover,
  #ui-datepicker-div .ui-datepicker-prev:focus,
  #ui-datepicker-div .ui-datepicker-next:focus,
  #ui-datepicker-div .ui-datepicker-next:hover {
    box-shadow: 0 0 0 2px #FFF, 0 0 2px 1px #FFF;
    outline: 1px solid transparent;
  }

  #ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev::before,
  #ui-datepicker-div .ui-datepicker-header a.ui-datepicker-next::before {
    position: absolute;
    content: ">";
    color: #FFF;
    left: 10px;
    font-size: var(--wbtm_fs_h3);
    top: 5px;
    font-weight: bold;
    line-height: 1;
  }

  #ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev::before {
    content: "<";
  }

  #ui-datepicker-div .ui-datepicker-header .ui-state-hover {
    background-color: var(--wbtm_color_theme);
    background-image: none;
    border-color: var(--wbtm_color_theme);
  }

  #ui-datepicker-div .ui-state-default {
    background-color: transparent;
    background-image: none;
    border: none;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    color: var(--wbtm_color_theme);
    font-weight: bold;
    padding: 0;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
  }

  #ui-datepicker-div a.ui-state-default:hover {
    background-color: var(--wbtm_color_theme);
    color: var(--wbtm_color_theme_alter);
  }

  #ui-datepicker-div .ui-state-active {
    background-color: var(--wbtm_color_theme);
    color: var(--wbtm_color_theme_alter);
    background-image: none;
  }

  #ui-datepicker-div .ui-datepicker-title {
    background-color: var(--wbtm_color_theme);
    color: var(--wbtm_color_theme_alter);
    background-image: none;
    font-size: var(--wbtm_fs_h5);
    display: -webkit-flex;
    display: flex;
    margin: 0;
  }

  #ui-datepicker-div .ui-datepicker-title select {
    min-width: 100px;
    height: 30px;
    font-size: var(--wbtm_fs);
    padding: 0 var(--wbtm_dmp_xs);
    text-align: left;
  }

  #ui-datepicker-div.ui-datepicker td {
    background-color: floralwhite;
    border: 1px dotted #000;
    padding: 4px 6px;
  }
}

/* Responsive adjustments for rotated seats */
@media only screen and (max-width: 768px) {

  .wbtm_seat_rotated_90 .mp_seat .seat_number,
  .wbtm_seat_rotated_270 .mp_seat .seat_number {
    font-size: 0.9em;
  }

  .wbtm_seat_rotated_180 .mp_seat .seat_number {
    font-size: 0.95em;
  }
}


/* Responsive adjustments for cabin layouts */
@media only screen and (max-width: 960px) {
  .wbtm_style {
    padding: 10px;
    border-radius: 15px;
  }

  .wbtm_input_fields_holder {
    gap: 15px;
    width: 100% !important;
  }

  .wbtm_input_fields_holder,
  .wbtm_search_input_fields_holder {
    flex-direction: column !important;
  }

  .wbtm_input_fields_holder,
  .wbtm_input_start_end_location,
  .wbtm_input_start_end_date,
  .wtbm_bus_search_button_holder {
    width: 100% !important;
  }

.search_button_holder {
  width: 100%;
}

.wbtm_search_action_button {
  align-items: center;
  justify-content: center;
}

.wbtm_search_action_button.wbtm_is_loading {
  cursor: wait;
  opacity: 0.85;
  pointer-events: none;
}

.search_button_holder > .wbtm_search_button_spacer {
  display: none !important;
}

  .wbtm_bus_submit,
  .get_wbtm_bus_list {
    width: 100% !important;
    justify-content: center !important;
    padding: 12px !important;
  }
}

@media only screen and (max-width: 600px) {

  .wbtm_input_start_end_location,
  .wbtm_input_start_end_date {
    flex-direction: column !important;
    gap: 10px !important;
  }

  .wtbm_inputList {
    width: 100% !important;
    margin: 0 0 10px 0 !important;
  }

  .wbtm_search_location_toggle {
    top: 50% !important;
    left: auto !important;
    right: 15px !important;
    transform: translateY(-50%) rotate(90deg) !important;
  }

  .wbtm_dropping_point {
    margin-top: 5px !important;
  }
}

@media only screen and (max-width: 768px) {
  .wbtm_selected_seat_details table tr th {
    font-size: 14px;
  }

  table.wbtm_totals tbody tr h5 {
    font-size: 14px;
  }

  .wbtm_cabin_toggle {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .wbtm_cabin_title_container {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .wbtm_cabin_title_container .wbtm_cabin_title {
    font-size: 16px;
  }

  .wbtm_cabin_toggle_icon {
    align-self: flex-end;
  }

  .wbtm_cabin_seat_plan {
    padding: 15px;
  }

  .wbtm_cabin_seat_plan table {
    border-spacing: 6px;
  }

}

/*# sourceMappingURL=wbtm.css.map */
@media (min-width:0px) {

div[class*=wbtm_loader] {
  background: rgba(0, 0, 0, 0.2);
  color: var(--wbtm_color_theme);
}
div[class*=wbtm_loader] span{width:initial !important;margin: 0 !important;}
div[class*=wbtm_loader].border_spin_loader span {
  border-top: 5px solid var(--wbtm_color_theme_alter);
  border-right: 5px solid var(--wbtm_color_theme);
  border-bottom: 5px solid var(--wbtm_color_theme_alter);
  border-left: 5px solid var(--wbtm_color_theme);
  width: 60px;
  height: 60px;
  -webkit-animation: spin 1000ms linear infinite;
  animation: spin 1000ms linear infinite;
}

div[class*=simpleSpinner] {
  padding: var(--wbtm_dmp);
  color: var(--wbtm_color_theme);
}
.wbtm_ex_service_area h3{
  font-size: 14px;
  font-weight: normal;
}
/*****Text Theme*********/
div.wbtm_style .textTheme,
div.wbtm_style [class*=_textTheme] {
  color: var(--wbtm_color_theme);
}

div.wbtm_style .bgTheme,
div.wbtm_style [class*=_bgTheme] {
  background-color: var(--wbtm_color_theme);
  color: var(--wbtm_color_theme_alter);
}

div.wbtm_style [class*=_bTheme],
.bTheme {
  border: 1px solid var(--wbtm_color_theme);
}

.pickup-point,
.drop-off-point {
  margin-left: 8px;
  border-left: 1px solid;
  flex-direction: column;
}
.pickup-point .point,
.drop-off-point .point {
  margin-left: -0.57em;
  padding: 15px 0;
}
.pickup-point .point:first-child,
.drop-off-point .point:first-child {
  padding-top: 21px;
}
.pickup-point .point:last-child,
.drop-off-point .point:last-child {
  padding-bottom: 0;
  line-height: 0;
  margin-bottom: 24px;
}

.wbtm_selected_seat_details table thead th {
  font-size: 16px;
  color: #666;
  font-weight: normal;
}
.wbtm_selected_seat_details table tbody tr {
  border-bottom: 1px solid #d8d8d8;
}

table.wbtm_totals tbody tr h5 {
  font-size: 16px;
  color: #333;
}

div.wbtm_selected_seat_details table tbody tr td {
  border-bottom: 1px solid #d8d8d8;
}

.wbtm_ex_service_area table thead th {
  font-size: 16px;
  color: #666;
}
.wbtm_ex_service_area table tbody tr:nth-child(2n+1) {
  background: none;
}
.wbtm_ex_service_area table tr:nth-child(2n) {
  background: none;
}

.wbtm-seat-book.hide {
  display: none;
}

.wbtm_bus_details_tabs_holder .wbtm-seat-book {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-left: auto;
  width: auto;
}

.wbtm_bus_details_tabs_holder .wbtm-seat-book > button,
.wbtm_bus_details_tabs_holder .wbtm-full-bus-booking > button {
  width: auto;
  white-space: nowrap;
}

.wbtm-full-bus-booking {
  display: flex;
  align-items: center;
  gap: 0;
  margin-left: 0;
  position: relative;
}

.wbtm-full-bus-booking > .wbtm_full_bus_book_now {
  margin: 0;
  border-radius: 4px 0 0 4px !important;
}

.wbtm-full-bus-booking.hide {
  display: none;
}

.wbtm-full-bus-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  align-self: stretch;
  height: 38px;
  min-height: 38px;
}

.wbtm-full-bus-tooltip-toggle {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 38px;
  min-width: 34px;
  min-height: 38px;
  padding: 0;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 0 4px 4px 0;
  background: var(--wbtm_theme_color);
  color: #fff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  opacity: 1;
  visibility: visible;
}

.wbtm-full-bus-tooltip-toggle span {
  display: inline-block !important;
  color: #fff;
  opacity: 1;
  visibility: visible;
}

.wbtm-full-bus-tooltip-toggle::before {
  content: "?";
  display: inline-block;
  color: #fff;
}

.wbtm-full-bus-tooltip-toggle span {
  display: none !important;
}

.wbtm-full-bus-tooltip-toggle:focus {
  outline: 1px solid rgba(255, 255, 255, 0.55);
  outline-offset: -3px;
}

.wbtm-full-bus-tooltip-panel {
  display: none;
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  z-index: 20;
  min-width: 150px;
  padding: 8px 10px;
  border: 1px solid #d9dfe7;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  flex-direction: column;
  gap: 2px;
  line-height: 1.2;
  text-align: left;
  white-space: nowrap;
}

.wbtm-full-bus-tooltip.is-open .wbtm-full-bus-tooltip-panel {
  display: flex;
}

.wbtm-full-bus-tooltip-panel span {
  font-size: 12px;
  color: var(--wbtm_d_color);
}

.wbtm-full-bus-tooltip-panel del,
.wbtm-full-bus-tooltip-panel small {
  font-size: 12px;
  color: #69727d;
}

.wbtm-full-bus-tooltip-panel del {
  text-decoration-thickness: 1px;
}

.wbtm-full-bus-tooltip-panel strong {
  color: var(--wbtm_theme_color);
}

@media only screen and (max-width: 767px) {
  .wbtm_bus_details_tabs_holder .wbtm-seat-book {
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
  }
}

/* Frontend Seat Rotation Styles */
.wbtm_seat_rotated_90 .mp_seat .seat_visual {
  transform: rotate(90deg);
  transform-origin: center;
}

.wbtm_seat_rotated_180 .mp_seat .seat_visual {
  transform: rotate(180deg);
  transform-origin: center;
}

.wbtm_seat_rotated_270 .mp_seat .seat_visual {
  transform: rotate(270deg);
  transform-origin: center;
}

/* Ensure seat number text never rotates */
.wbtm_seat_rotated_90 .mp_seat .seat_number,
.wbtm_seat_rotated_180 .mp_seat .seat_number,
.wbtm_seat_rotated_270 .mp_seat .seat_number {
  transform: none !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  rotate: none !important;
  transform-origin: initial !important;
}

/* Additional protection for seat numbers */
.mp_seat_item .seat_number {
  transform: none !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  rotate: none !important;
  transform-origin: initial !important;
  position: relative !important;
  z-index: 999 !important;
}

/* Ensure rotated seats maintain proper spacing and alignment */
.wbtm_seat_plan_area .mp_seat_item {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 40px;
}

.wbtm_seat_plan_area .mp_seat_item .mp_seat {
  transition: transform 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  position: relative;
  flex-direction: column;
  background-color: transparent;
  border: none;
}

/* Seat structure styles */
.seat_visual {
  width: 100%;
  height: 100%;
  background-color: inherit;
  border: inherit;
  border-radius: inherit;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  transition: transform 0.3s ease;
}

/* Ensure seat_visual inherits all visual styling from parent seat */
.mp_seat .seat_visual {
  background-color: inherit;
  border: inherit;
  border-radius: inherit;
  cursor: inherit;
}

/* Specific seat state styling for seat_visual */
.seat_available .seat_visual {
  background-color: var(--wbtm_color_theme_alter);
  cursor: pointer;
}

.seat_selected.seat_available .seat_visual {
  background-color: var(--wbtm_color_theme);
  color: #ffffff;
}

.seat_booked .seat_visual {
  cursor: not-allowed;
  background-color: var(--wbtm_color_warning);
}

.seat_in_cart .seat_visual {
  cursor: not-allowed;
  background-color: var(--wbtm_color_light_3);
}

/* Override existing seat styling to move visual properties to seat_visual */
.mp_seat.seat_available {
  background-color: transparent !important;
  border: none !important;
}

.mp_seat.seat_booked {
  background-color: transparent !important;
  border: none !important;
}

.mp_seat.seat_in_cart {
  background-color: transparent !important;
  border: none !important;
}

/* Ensure seat_visual gets the border styling */
.seat_visual {
  border: 1px solid var(--wbtm_color_border) !important;
}

.seat_number {
  position: relative;
  z-index: 2;
  font-weight: bold;
  color: inherit;
  text-align: center;
  line-height: 1;
  pointer-events: none;
  transform: none !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

/* Ensure consistent seat styling for both lower and upper deck */
.wbtm_seat_plan_area table th,
.wbtm_seat_plan_area table td {
  min-height: 60px !important;
  text-align: center !important;
  height: 60px !important;
  width: 60px !important;
  background-color: var(--wbtm_color_theme_alter) !important;
  padding: 5px !important;
  min-width: 60px !important;
}

/* Make upper deck exactly the same as lower deck */
.wbtm_seat_plan_upper {
  /* Inherit all lower deck styles */
}

.wbtm_seat_plan_upper table {
  margin: 0 auto !important;
}

.wbtm_seat_plan_upper table tr {
  background-color: var(--wbtm_color_theme_alter) !important;
}

.wbtm_seat_plan_upper table th,
.wbtm_seat_plan_upper table td {
  min-height: 60px !important;
  text-align: center !important;
  height: 60px !important;
  width: 60px !important;
  background-color: var(--wbtm_color_theme_alter) !important;
  padding: 5px !important;
  min-width: 60px !important;
}

.wbtm_seat_plan_upper table thead th {
  height: auto !important;
}

/* More specific selectors to override global CSS */
div.wbtm_bus_list_area div.wbtm_seat_plan_area table th,
div.wbtm_bus_list_area div.wbtm_seat_plan_area table td,
div.wbtm_bus_list_area div.wbtm_seat_plan_upper table th,
div.wbtm_bus_list_area div.wbtm_seat_plan_upper table td {
  min-height: 60px !important;
  text-align: center !important;
  height: 60px !important;
  width: 60px !important;
  background-color: var(--wbtm_color_theme_alter) !important;
  padding: 5px !important;
  min-width: 60px !important;
}

/* Ensure seat items have consistent styling */
.wbtm_seat_plan_area .mp_seat_item,
.wbtm_seat_plan_upper .mp_seat_item {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Ensure seats have consistent styling */
.wbtm_seat_plan_area .mp_seat,
.wbtm_seat_plan_upper .mp_seat {
  border: 1px solid var(--wbtm_color_border);
  width: 100%;
  height: 100%;
  border-radius: 15px 15px 0 0;
  border-bottom: 5px solid var(--wbtm_color_light);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* More specific selectors for seat styling - moved visual properties to seat_visual */
div.wbtm_bus_list_area div.wbtm_seat_plan_area div.mp_seat,
div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.mp_seat {
  border: none !important;
  background-color: transparent !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Apply visual styling to seat_visual instead */
div.wbtm_bus_list_area div.wbtm_seat_plan_area div.mp_seat .seat_visual,
div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.mp_seat .seat_visual {
  border: 1px solid var(--wbtm_color_border) !important;
  border-radius: 15px 15px 0 0 !important;
  border-bottom: 5px solid var(--wbtm_color_light) !important;
}

/* Force upper deck to use exact same styling as lower deck */
.wbtm_seat_plan_upper div.mp_seat_item {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
}

.wbtm_seat_plan_upper div.mp_seat {
  border: 1px solid var(--wbtm_color_border) !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 15px 15px 0 0 !important;
  border-bottom: 5px solid var(--wbtm_color_light) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Most aggressive approach - copy exact lower deck styles to upper deck */
div.wbtm_bus_list_area div.wbtm_seat_plan_upper table {
  margin: 0 auto !important;
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper table tr {
  background-color: var(--wbtm_color_theme_alter) !important;
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper table th,
div.wbtm_bus_list_area div.wbtm_seat_plan_upper table td {
  min-height: 60px !important;
  text-align: center !important;
  height: 60px !important;
  width: 60px !important;
  background-color: var(--wbtm_color_theme_alter) !important;
  padding: 5px !important;
  min-width: 60px !important;
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper table thead th {
  height: auto !important;
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.mp_seat_item {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.mp_seat {
  border: none !important;
  background-color: transparent !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Ensure seat states are consistent - moved to seat_visual */
div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.seat_available {
  background-color: transparent !important;
  cursor: pointer !important;
  /*color: var(--wbtm_d_color) !important;*/
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.seat_booked {
  cursor: not-allowed !important;
  background-color: transparent !important;
  color: var(--wbtm_color_theme_alter) !important;
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.seat_in_cart {
  cursor: not-allowed !important;
  background-color: transparent !important;
  color: var(--wbtm_color_theme_alter) !important;
}

/* Apply seat state styling to seat_visual */
div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.seat_available .seat_visual {
  /*background-color: var(--wbtm_color_theme_alter) !important;*/
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.seat_booked .seat_visual {
  background-color: var(--wbtm_color_warning) !important;
}

div.wbtm_bus_list_area div.wbtm_seat_plan_upper div.seat_in_cart .seat_visual {
  background-color: var(--wbtm_color_light_3) !important;
}

/* ULTIMATE FIX - Force upper deck to be exactly like lower deck */
.wbtm_seat_plan_upper * {
  box-sizing: border-box !important;
}

.wbtm_seat_plan_upper table {
  table-layout: fixed !important;
  margin: 0 auto !important;
}

.wbtm_seat_plan_upper table th,
.wbtm_seat_plan_upper table td {
  width: 60px !important;
  height: 60px !important;
  min-width: 60px !important;
  min-height: 60px !important;
  max-width: 60px !important;
  max-height: 60px !important;
  padding:0 35px !important;
  margin: 0 !important;
  border: none !important;
  background-color: var(--wbtm_color_theme_alter) !important;
  text-align: center !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
  font-size: 17px !important;
}

.wbtm_seat_plan_upper .mp_seat_item {
  width: 60px !important;
  height: 50px !important;
  min-width: 60px !important;
  min-height: 50px !important;
  max-width: 60px !important;
  max-height: 50px !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.wbtm_seat_plan_upper .mp_seat {
  width: 60px !important;
  height: 50px !important;
  min-width: 60px !important;
  min-height: 50px !important;
  max-width: 60px !important;
  max-height: 50px !important;
  border: 1px solid var(--wbtm_color_border) !important;
  border-radius: 15px 15px 0 0 !important;
  border-bottom: 5px solid var(--wbtm_color_light) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

/* Override any other styles that might be affecting upper deck */
.wbtm_seat_plan_upper {
  font-size: inherit !important;
}

.wbtm_seat_plan_upper * {
  font-size: inherit !important;
}

/* Force the same dimensions as lower deck */
.wbtm_seat_plan_upper table th,
.wbtm_seat_plan_upper table td {
  font-size: 12px !important;
  line-height: 1 !important;
}

/* Fix seat price dropdown positioning for ALL seat plans */
.wbtm_seat_plan_area .mp_seat_item,
.wbtm_seat_plan_upper .mp_seat_item,
.wbtm_cabin_seat_plan .mp_seat_item {
  position: relative !important;
  overflow: visible !important;
  z-index: 1 !important;
}

/* Increase z-index when hovering to bring tooltip above other seats */
.wbtm_seat_plan_area .mp_seat_item:hover,
.wbtm_seat_plan_upper .mp_seat_item:hover,
.wbtm_cabin_seat_plan .mp_seat_item:hover {
  z-index: 9999 !important;
}

.wbtm_seat_plan_area .mp_seat_item .wbtm_seat_item_list,
.wbtm_seat_plan_upper .mp_seat_item .wbtm_seat_item_list,
.wbtm_cabin_seat_plan .mp_seat_item .wbtm_seat_item_list {
  position: absolute !important;
  left: 0 !important;
  top: 100% !important;
  min-width: 150px !important;
  width: 100% !important;
  display: none !important;
  z-index: 99999 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style-type: none !important;
  background-color: var(--wbtm_color_light) !important;
  border: 1px solid var(--wbtm_color_theme) !important;
  border-radius: var(--wbtm_dbr) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
}

.wbtm_seat_plan_area .mp_seat_item:hover .wbtm_seat_item_list,
.wbtm_seat_plan_upper .mp_seat_item:hover .wbtm_seat_item_list,
.wbtm_cabin_seat_plan .mp_seat_item:hover .wbtm_seat_item_list {
  display: block !important;
}

.wbtm_seat_plan_area .mp_seat_item .wbtm_seat_item_list::before,
.wbtm_seat_plan_upper .mp_seat_item .wbtm_seat_item_list::before,
.wbtm_cabin_seat_plan .mp_seat_item .wbtm_seat_item_list::before {
  position: absolute !important;
  content: "" !important;
  width: 20px !important;
  height: 20px !important;
  left: 15px !important;
  top: -20px !important;
  border: 10px solid transparent !important;
  border-bottom-color: var(--wbtm_color_theme) !important;
  z-index: 99998 !important;
}

.wbtm_seat_plan_area .mp_seat_item .wbtm_seat_item_list li,
.wbtm_seat_plan_upper .mp_seat_item .wbtm_seat_item_list li,
.wbtm_cabin_seat_plan .mp_seat_item .wbtm_seat_item_list li {
  cursor: pointer !important;
  padding: 5px var(--wbtm_dmp_xs) !important;
  background-color: var(--wbtm_color_light) !important;
  border-bottom: 1px solid #eee !important;
  position: relative !important;
  z-index: 99999 !important;
}

.wbtm_seat_plan_area .mp_seat_item .wbtm_seat_item_list li:last-child,
.wbtm_seat_plan_upper .mp_seat_item .wbtm_seat_item_list li:last-child,
.wbtm_cabin_seat_plan .mp_seat_item .wbtm_seat_item_list li:last-child {
  border-bottom: none !important;
}

.wbtm_seat_plan_area .mp_seat_item .wbtm_seat_item_list li:hover,
.wbtm_seat_plan_upper .mp_seat_item .wbtm_seat_item_list li:hover,
.wbtm_cabin_seat_plan .mp_seat_item .wbtm_seat_item_list li:hover {
  background-color: var(--wbtm_color_theme) !important;
  color: var(--wbtm_color_theme_alter) !important;
}

/* Fix positioning for seats on the right side */
.wbtm_seat_plan_area table tr th:nth-last-child(2) .wbtm_seat_item_list,
.wbtm_seat_plan_area table tr th:last-child .wbtm_seat_item_list,
.wbtm_seat_plan_upper table tr th:nth-last-child(2) .wbtm_seat_item_list,
.wbtm_seat_plan_upper table tr th:last-child .wbtm_seat_item_list,
.wbtm_cabin_seat_plan table tr th:nth-last-child(2) .wbtm_seat_item_list,
.wbtm_cabin_seat_plan table tr th:last-child .wbtm_seat_item_list {
  right: 0 !important;
  left: inherit !important;
}

.wbtm_seat_plan_area table tr th:nth-last-child(2) .wbtm_seat_item_list::before,
.wbtm_seat_plan_area table tr th:last-child .wbtm_seat_item_list::before,
.wbtm_seat_plan_upper table tr th:nth-last-child(2) .wbtm_seat_item_list::before,
.wbtm_seat_plan_upper table tr th:last-child .wbtm_seat_item_list::before,
.wbtm_cabin_seat_plan table tr th:nth-last-child(2) .wbtm_seat_item_list::before,
.wbtm_cabin_seat_plan table tr th:last-child .wbtm_seat_item_list::before {
  left: inherit !important;
  right: 15px !important;
}

/* Fix positioning for seats on the bottom rows */
.wbtm_seat_plan_area table tr:nth-last-child(2) th .wbtm_seat_item_list,
.wbtm_seat_plan_area table tr:last-child th .wbtm_seat_item_list,
.wbtm_seat_plan_upper table tr:nth-last-child(2) th .wbtm_seat_item_list,
.wbtm_seat_plan_upper table tr:last-child th .wbtm_seat_item_list,
.wbtm_cabin_seat_plan table tr:nth-last-child(2) th .wbtm_seat_item_list,
.wbtm_cabin_seat_plan table tr:last-child th .wbtm_seat_item_list {
  top: calc(-100% - 23px) !important;
}

.wbtm_seat_plan_area table tr:nth-last-child(2) th .wbtm_seat_item_list::before,
.wbtm_seat_plan_area table tr:last-child th .wbtm_seat_item_list::before,
.wbtm_seat_plan_upper table tr:nth-last-child(2) th .wbtm_seat_item_list::before,
.wbtm_seat_plan_upper table tr:last-child th .wbtm_seat_item_list::before,
.wbtm_cabin_seat_plan table tr:nth-last-child(2) th .wbtm_seat_item_list::before,
.wbtm_cabin_seat_plan table tr:last-child th .wbtm_seat_item_list::before {
  top: 100% !important;
  border-top-color: var(--wbtm_color_theme) !important;
  border-bottom-color: transparent !important;
}

/* Ensure containers don't clip the dropdown */
.wbtm_seat_plan_area,
.wbtm_seat_plan_upper,
.wbtm_cabin_seat_plan {
  overflow: visible !important;
  position: relative !important;
}

.wbtm_seat_plan_area .ovAuto,
.wbtm_seat_plan_upper .ovAuto,
.wbtm_cabin_seat_plan .ovAuto {
  overflow: visible !important;
}

/* Cabin-specific styles for train/bus multi-cabin support */
.wbtm_cabin_section {
  margin-bottom: 20px;
  border: 1px solid var(--wbtm_color_border);
  border-radius: 12px;
  background-color: var(--wbtm_color_light);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .04), 0 6px 18px rgba(0, 0, 0, .05);
  overflow: hidden;
}

.wbtm_cabin_section:last-child {
  margin-bottom: 0;
}

/* Ensure collapsed cabins don't take extra space */
.wbtm_cabin_section.collapsed {
  margin-bottom: 10px;
}

.wbtm_cabin_header {
  background-color: var(--wbtm_color_theme);
  color: white;
  padding: 16px 22px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
  transition: filter .15s ease;
}
.wbtm_cabin_header:hover {
  filter: brightness(1.06);
}

.wbtm_cabin_toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.wbtm_cabin_title_container {
  display: flex;
  align-items: center;
  gap: 15px;
}

.wbtm_cabin_toggle_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  flex-shrink: 0;
}

.wbtm_toggle_arrow {
  font-size: 16px;
  font-weight: bold;
  transition: transform 0.3s ease;
  display: inline-block;
}

.wbtm_cabin_title_container .wbtm_cabin_title {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

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

.wbtm_price_multiplier {
  background-color: rgba(255, 255, 255, 0.2);
  color: white;
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
}

.wbtm_price_discount {
  background-color: rgba(76, 175, 80, 0.8);
  color: white;
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
}

.wbtm_cabin_seat_plan {
  padding: 24px 20px;
  background-color: white;
}

.wbtm_cabin_seat_plan table {
  margin: 0 auto;
  border-collapse: separate;
  border-spacing: 8px;
}

.wbtm_cabin_seat_plan .mp_seat_item {
  position: relative;
}

.wbtm_cabin_direction {
  text-align: center;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  margin-bottom: 16px;
}

.wbtm_cabin_seat_plan .seat_available {
  cursor: pointer;
  transition: all 0.3s ease;
}

.wbtm_cabin_seat_plan .seat_available:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.wbtm_cabin_seat_plan .seat_booked,
.wbtm_cabin_seat_plan .seat_in_cart {
  opacity: 0.7;
}


.wbtm_search_input_fields_holder{
  display: flex;
  width: 100%;
  gap: 10px;
  align-items: flex-end;
}

.wbtm_input_start_end_location{
  position: relative;
  display: flex;
  align-items: center;
}
.wbtm_start_point,
.wbtm_dropping_point{
  width: 50%;
}
.wbtm_search_location_toggle{
  position: absolute ;
  margin: 9px -4px;
  top: 60%;
  left: 50%;
  transform: translate(-50%,-50%);
  z-index: 2;
  padding: 5px 7px;
  width:30px;
  height: 30px;
  background-color: #ddd;
  border-radius: 50%;
  border: 1px solid #bbb;
  cursor: pointer;
  box-shadow: 0 0 5px rgba(50, 50, 50, 0.3);
}

.wbtm_search_location_toggle:hover{
  background: var(--wbtm_color_theme);
  border: 1px solid rgba(50, 50, 50, 0.3);
}
.wbtm_search_location_toggle:hover i{
  color: #fff;
}

.wbtm_search_location_toggle i{
  font-size: 15px;
  line-height: 0;
  transition: transform 0.35s ease;
  color: var(--wbtm_color_theme);
}

.wbtm_search_location_toggle.rotate i{
  transform: rotate(180deg);
}
.swap-animation{
  transition: all .3s ease-in-out;
  transform: translateY(6px);
  opacity: 0.6;
}

.wbtm_input_fields_holder{
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}
.wbtm_search_action_button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 8px;
  white-space: nowrap;
  line-height: 1;
}
.wbtm_search_action_button.wbtm_is_loading{
  cursor: wait;
  opacity: 0.85;
  pointer-events: none;
}
.wbtm_search_action_button .wbtm_search_button_text{
  display: inline-block;
  white-space: nowrap;
}

.wtbm_bus_search_button_holder{
  flex: 0 0 auto;
  display: flex;
  align-items: flex-end;
}
.wbtm_input_start_end_location,
.wbtm_input_start_end_date{
  display: flex;
  width: 50%;
  position: relative;
}
  .wbtm-bus-flix-style {
    display: flex;
    flex-direction: column;
    background-color: var(--wbtm_color_light);
    border: 1px solid var(--wbtm_color_border);
    margin: 10px auto;
    border-radius: 5px;
    padding: 10px;
    font-family: sans-serif;
  }

  .wbtm-bus-flix-style_bus {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    font-family: sans-serif;
  }

  /* Per-departure bus/boat photo (restored: the modern card rewrite
     dropped the thumbnail; helper + fallback logic still intact). */
  .wbtm-bus-flix-style_bus .wbtm-flix-photo {
    flex: 0 0 110px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    margin-right: 14px;
    background: #eef3fb;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* !important beats themes that force `img { height:auto }`. */
  .wbtm-bus-flix-style_bus .wbtm-flix-photo img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  .wbtm-bus-flix-style .title {
    width: 100%;
  }

  .wbtm-bus-flix-style .title span {
    padding: 0 8px;
    border-radius: 50px;
    color: #fff;
    background-color: var(--wbtm_color_theme_cc);
    font-size: 11px;
    line-height: 2;
  }

  .wbtm-bus-flix-style .route {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    align-items: center;
  }

  .wbtm-bus-flix-style .route .route-info {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: space-between;
    align-items: center;
    margin: 14px 0;
  }

  .wbtm-bus-flix-style .route .route-info .from,
  .wbtm-bus-flix-style .route .route-info .to {
    width: 45%;
  }

  .wbtm-bus-flix-style .route .route-info .to {
    padding-left: 0;
  }

  .wbtm-bus-flix-style .route .route-info .duration {
    border-bottom: 3px solid var(--wbtm_d_color);
    width: 33%;
    position: relative;
  }

  .wbtm-bus-flix-style .route .route-info .duration .time {
    background: var(--wbtm_color_light);
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    padding: 0 5px;
  }

  .wbtm-bus-flix-style .feature {
    display: flex;
    justify-content: start;
    align-items: center;
  }

  .wbtm-bus-flix-style .feature .items {
    padding: 2px 8px;
    border-radius: 50px;
  }

  .wbtm_style {
    background-color: #f5f7fa;
    padding: 20px;
    border-radius: 20px;
    font-weight: normal;
    font-size: 15px;
    color: #333;
  }

  .wbtm_style .wbtm_search_area {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;

  }

  .wbtm_search_area .inputList {
    margin: 0 10px 5px 0;
  }

  .wtbm_inputList label {
    width: 100%;
  }

  .wbtm_search_input_fields_holder .marker,
  .wbtm_search_input_fields_holder .calendar {
    margin-top: 5px;
  }

  .wtbm_inputList {
    flex: 1;
    margin: 0 5px 0 0;
  }

  .wbtm_search_area .wtbm_inputList:last-child,
  .wbtm_search_area .inputList:last-child {
    margin-right: 0;
  }

  .wbtm_search_area .marker,
  .wbtm_search_area .calendar {
    position: relative;
  }

  .wbtm_search_area .marker i,
  .wbtm_search_area .calendar i {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px;
    color: #999;
  }

  .wbtm_search_area .marker input,
  .wbtm_search_area .calendar input {
    padding-left: 30px;
    font-size: 16px;

  }

  .wbtm_search_result .wbtm-date-suggetion {
    margin: 10px;
    overflow: auto;
    background-color: #ddd;
    padding: 5px;
    border-radius: 8px;
  }

  .wbtm_search_result .wbtm-date-suggetion .wbtm_next_date {
    margin-right: 5px;
    padding: 10px;
    text-align: center;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid #ddd;
    background-color: #fff;
    color: var(--wbtm_d_color);
    font-weight: normal;
    font-size: 14px;
  }

  #ui-datepicker-div {
    position: inherit;
    z-index: 2 !important;
  }

  .wbtm_search_result .wbtm-date-suggetion .wbtm_next_date:last-child {
    margin-right: 0;
  }

  .wbtm_search_result .wbtm-date-suggetion .wbtm_next_date:hover {
    color: var(--wbtm_color_theme);
    border: 1px solid var(--wbtm_color_theme);
  }

  .wbtm_search_result .wbtm-date-suggetion .wbtm_next_date.active {
    background-color: #f0f6ff;
    color: #4285f4;
    border: 1px solid #4285f4;
  }

  .wbtm_search_result .wbtm-date-route {
    background-color: white;
    padding: 15px;
    border-radius: 12px 12px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
    border-bottom: 2px solid var(--wbtm_color_theme);
  }

  .wbtm-date-return-route {
    background-color: white;
    padding: 15px;
    border-radius: 5px 5px 5px 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
    /*border-bottom: 2px solid var(--wbtm_color_theme);*/
  }

  .wbtm_search_result .wbtm-bus-list {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    transition: all 0.3s;
    margin-top: 0;
    margin-bottom: 15px;
    background-color: #fff;
    border-radius: 12px;
    display: flex;
    justify-content: space-between;
    gap: 0;
    flex-wrap: wrap;
    border: 1px solid #ddd;
  }

  .wbtm_search_result .wbtm-bus-list:hover {
    transform: none;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image {
    border-radius: 12px 0 0 12px;
    width: 100%;
    height: 250px;
    padding: 10px;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image img {
    height: 100%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image .bg_image_area {
    width: 100%;
    height: 100%;
    border-radius: 0 0 0 12px;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image .bg_image_area>div {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    border-radius: 0 0 0 12px;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-name {
    margin: 0;
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-items: start;
    width: 100%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-name p {
    font-size: 14px;
    color: gray;
  }

  .wbtm_search_result .wbtm-bus-route {
    margin: 0;
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-items: start;
    gap: 10px;
    width: 100%;
  }

  .wbtm_search_result .wbtm-bus-route h6 {
    font-weight: normal;
    font-size: 16px;
  }

  .wbtm_search_result .wbtm-bus-route h6 i {
    padding-right: 10px;
    color: gray;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-seat-info {
    margin: 0;
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: auto;
    width: 33%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-seat-info:last-child {
    border-right: 0;
  }

  .wbtm_search_result .wbtm-bus-list .ac {
    background-color: #e0f7fa;
    color: #0097a7;
    padding: 3px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    gap: 5px;
  }

  .wbtm_search_result .wbtm-bus-list .none-ac {
    background-color: #fff8e1;
    color: #ffa000;
    padding: 2px 6px;
    border-radius: 5px;
  }

  .wbtm_search_result .wbtm-bus-list .seats-available {
    color: #28a745;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
  }

  .wbtm_search_result .wbtm-bus-list .seats-price {
    color: var(--wbtm_color_theme);
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-seat-book {
    margin: 0;
    padding: 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: auto;
    border-right: 0;
    width: 100%;
  }


  .wbtm_search_result .wbtm-bus-lists .lists-title {
    background: linear-gradient(105deg, #dddddd, #d8d8d8);
    color: var(--wbtm_color_theme);
    padding: 10px 0;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    margin: 30px 0;
    text-align: center;
  }

  .wbtm_search_result .wbtm-bus-lists .wbtm_registration_area {
    padding: 20px;
    border: 1px solid #d0d0d0;
    margin-bottom: 20px;
    border-radius: 20px;
  }



  .wbtm_style .themeButton,
  .wbtm_style [class*=_themeButton] {
    background-color: var(--wbtm_color_theme);
    color: var(--wbtm_color_theme_alter);
    padding: var(--wbtm_dmp_xs) var(--wbtm_dmp_xs);
    border: 1px solid var(--wbtm-primary);
  }

  .wbtm_style .themeButton span,
  .wbtm_style [class*=_themeButton] span {
    color: var(--wbtm_color_theme_alter);
  }

  .wbtm_style .themeButton:hover,
  .wbtm_style [class*=_themeButton]:hover {
    background-color: var(--wbtm_color_theme);
    color: var(--wbtm_color_theme_alter);
    border-color: var(--wbtm_color_theme);
  }

  .wbtm_style .themeButton:hover span,
  .wbtm_style [class*=_themeButton]:hover span {
    color: var(--wbtm_color_theme_alter);
  }

  .wbtm_bus_info_holder {
    flex-wrap: wrap;
  }

  .wbtm_bus_info_details_holder {
    width: 100%;
    display: flex;
    flex-direction: column;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image {
    width: 100%;
    height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #f5f5f5;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image img {
    height: 100%;
  }

  .wbtm-bus-flix-style_bus {
    flex-direction: row;
    flex-wrap: nowrap;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-name {
    border-right: 1px solid #eee;
    width: 50%;
  }

  .wbtm_search_result .wbtm-bus-route {
    border-right: 0;
    width: 50%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-seat-info {
    border-right: 1px solid #eee;
    border-top: 1px solid #eee;
    width: 50%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-seat-book {
    width: auto;
  }

}

@media (min-width: 540px) {

  .wbtm-bus-flix-style .route .route-info .from,
  .wbtm-bus-flix-style .route .route-info .to {
    width: 33%;
  }
}

@media (min-width: 768px) {
  .wbtm_search_result .wbtm-bus-list {
    flex-direction: row;
    flex-wrap: nowrap;
    border: 0;
  }

  .wbtm_bus_info_details_holder {
    width: 75%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image {
    width: 25%;
    height: auto;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image img {
    height: auto;
  }

  .wbtm-bus-flix-style .title {
    width: 16%;
  }

  .wbtm-bus-flix-style .route {
    width: 40%;
  }

  .wbtm-bus-flix-style .route .route-info .to {
    padding-left: 20px;
  }
}

@media (min-width: 1240px) {
  .wbtm_bus_info_details_holder {
    width: 80%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image {
    width: 20%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-bus-name {
    width: 25%;
  }

  .wbtm_search_result .wbtm-bus-route {
    border-right: 1px solid #eee;
    width: 25%;
  }

  .wbtm_search_result .wbtm-bus-list .wbtm-seat-info {
    border-right: 1px solid #eee;
    border-top: 0;
    width: 25%;
  }
}

/* ===== Non-Seat Items (Frontend) ===== */
.wbtm_non_seat_item {
  text-align: center;
  vertical-align: middle;
  cursor: default !important;
  user-select: none;
  pointer-events: none;
  padding: 6px 4px;
  min-width: 50px;
}

.wbtm_non_seat_item .wbtm_non_seat_icon {
  display: block;
  font-size: 18px;
  color: #6c757d;
  margin-bottom: 3px;
  line-height: 1;
}

.wbtm_non_seat_item .wbtm_non_seat_label {
  display: block;
  font-size: 10px;
  color: #868e96;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1.2;
  font-weight: 600;
  white-space: nowrap;
}

.wbtm_seat_plan_area table td.wbtm_non_seat_item,
.wbtm_seat_plan_upper table td.wbtm_non_seat_item,
.wbtm_cabin_seat_plan table td.wbtm_non_seat_item {
  background-color: #f1f3f5 !important;
  border: 1px dashed #ced4da !important;
  border-radius: 4px;
  opacity: 0.85;
}

/* Aisle is rendered as an empty <td> (no icon/label markup at all) — just
   blank space, no border/background, unlike every other non-seat item above. */
.wbtm_seat_plan_area table td.wbtm_aisle_blank,
.wbtm_seat_plan_upper table td.wbtm_aisle_blank,
.wbtm_cabin_seat_plan table td.wbtm_aisle_blank {
  background: transparent !important;
  border: none !important;
  cursor: default !important;
  pointer-events: none;
}

@media only screen and (max-width: 768px) {
  .wbtm_non_seat_item .wbtm_non_seat_icon {
    font-size: 14px;
  }
  .wbtm_non_seat_item .wbtm_non_seat_label {
    font-size: 8px;
  }
}

/* ============================================================
   COMPREHENSIVE MOBILE RESPONSIVE FIXES
   ============================================================ */

/* ---- Search form layout ---- */
._dFlex_fdColumn_justifyBetween_fullHeight {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
}
/* Hide the blank spacer above the search button — alignment handled by flex-end */
._dFlex_fdColumn_justifyBetween_fullHeight > span:first-child {
  display: none !important;
}

@media only screen and (max-width: 960px) {
  /* Stack search form fields vertically */
  .wbtm_search_input_fields_holder {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .wbtm_input_fields_holder {
    flex: 1 1 auto !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }
  .wbtm_input_start_end_location,
  .wbtm_input_start_end_date {
    width: 100% !important;
    flex-direction: row;
  }
  .wtbm_bus_search_button_holder {
    flex: 0 0 auto !important;
    width: 100% !important;
  }
  ._dFlex_fdColumn_justifyBetween_fullHeight {
    width: 100% !important;
  }
  .wbtm_bus_submit,
  .get_wbtm_bus_list {
    width: 100% !important;
    justify-content: center !important;
    padding: 12px !important;
  }
}

@media only screen and (max-width: 600px) {
  /* Stack From/To on very small screens */
  .wbtm_input_start_end_location,
  .wbtm_input_start_end_date {
    flex-direction: column !important;
    gap: 8px !important;
  }
  .wtbm_inputList {
    width: 100% !important;
    margin: 0 !important;
  }
  /* Swap icon repositioned */
  .wbtm_search_location_toggle {
    position: static !important;
    transform: rotate(90deg) !important;
    margin: 4px auto !important;
    left: auto !important;
    top: auto !important;
  }
  /* Search form padding */
  ._dLayout.wbtm_search_area {
    padding: 12px !important;
  }
  .wbtm_style {
    padding: 8px !important;
  }
}

/* ---- Seat plan: scrollable on mobile ---- */
.wbtm_seat_plan_holder,
.wbtm_seat_plan_area,
.wbtm_seat_plan_upper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media only screen and (max-width: 600px) {
  /* Smaller seat cells on phones */
  .wbtm_seat_plan_area table th,
  .wbtm_seat_plan_area table td,
  div.wbtm_bus_list_area div.wbtm_seat_plan_area table th,
  div.wbtm_bus_list_area div.wbtm_seat_plan_area table td,
  .wbtm_seat_plan_upper table th,
  .wbtm_seat_plan_upper table td,
  div.wbtm_bus_list_area div.wbtm_seat_plan_upper table th,
  div.wbtm_bus_list_area div.wbtm_seat_plan_upper table td,
  .wbtm_cabin_seat_plan table th,
  .wbtm_cabin_seat_plan table td {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 3px !important;
  }
  .seat_number {
    font-size: 10px !important;
  }
}

/* ---- Date suggestion bar: horizontal scroll ---- */
.wbtm-date-suggetion {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
  gap: 6px;
  padding-bottom: 4px;
}
.wbtm-date-suggetion .wbtm_next_date {
  flex-shrink: 0 !important;
  white-space: nowrap;
}

/* ---- Search results: bus list cards ---- */
@media only screen and (max-width: 768px) {
  .wbtm_search_result .wbtm-bus-list {
    flex-direction: column !important;
  }
  .wbtm_search_result .wbtm-bus-list .wbtm-bus-image {
    width: 100% !important;
    height: 180px !important;
    border-radius: 12px 12px 0 0 !important;
  }
  .wbtm_bus_info_details_holder {
    width: 100% !important;
  }
  /* Route info container stacks */
  .wbtm_search_route_container {
    flex-direction: column !important;
  }
  .wbtm_search_route_cities_wrapper {
    width: 100% !important;
    flex-wrap: wrap;
  }
  .wbtm_search_route_icon_wrapper {
    display: none !important;
  }
  .wbtm_search_route_city_section,
  .wbtm_search_route_city_section_right {
    width: 48% !important;
    padding: 6px !important;
  }
  /* Bus info row stacks vertically */
  .wbtm_bus_info_holder {
    flex-direction: column !important;
    gap: 8px;
  }
  /* Force all bus card children full width when stacked */
  .wbtm_search_result .wbtm-bus-list .wbtm-bus-name,
  .wbtm_search_result .wbtm-bus-route,
  .wbtm_search_result .wbtm-bus-list .wbtm-seat-info {
    width: 100% !important;
    border-right: 0 !important;
    border-top: 0 !important;
  }
  /* Show seat-info divs side by side (price + seats) */
  .wbtm_bus_info_holder .wbtm-seat-info {
    width: 50% !important;
    display: inline-flex !important;
    vertical-align: top;
  }
  /* Route display in flix-style */
  .wbtm-bus-flix-style {
    flex-direction: column !important;
  }
  .wbtm-bus-flix-style .title,
  .wbtm-bus-flix-style .route,
  .wbtm-bus-flix-style .feature,
  .wbtm-bus-flix-style .price {
    width: 100% !important;
  }
  /* Date-route header wraps */
  .wbtm_search_result .wbtm-date-route,
  .wbtm-date-return-route {
    flex-direction: column !important;
    gap: 8px;
    align-items: flex-start !important;
  }
  /* Tabs scroll horizontally */
  .wbtm_bus_detail_popup_tabs {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }
  .wbtm_bus_detail_popup_tab {
    flex-shrink: 0 !important;
  }
}

/* ---- Popup / modal on mobile ---- */
@media only screen and (max-width: 768px) {
  .wbtm-bus-popup-inner {
    width: 95% !important;
    margin: 3% auto !important;
    padding: 14px !important;
    border-radius: 8px !important;
  }
  .wbtm-popup-content {
    max-width: 100% !important;
  }
}

/* ---- Registration / passenger form ---- */
@media only screen and (max-width: 768px) {
  .wbtm_registration_area,
  .wbtm_selected_seat_details {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .wbtm_selected_seat_details table {
    min-width: 320px;
  }
  /* Totals table */
  table.wbtm_totals {
    width: 100% !important;
  }
  /* Passenger form fields full width */
  .wbtm_passenger_form_area .col_6,
  .wbtm_passenger_form_area .col_4,
  .wbtm_passenger_form_area .col_3 {
    width: 100% !important;
    min-width: 100% !important;
  }
}

/* ---- Left filter panel ---- */
@media only screen and (max-width: 768px) {
  .wbtm_bus_left_filter_holder {
    width: 100% !important;
    margin-bottom: 12px;
  }
  .wbtm_bus_list_area {
    flex-direction: column !important;
  }
  .wbtm_bus_list_holder {
    width: 100% !important;
  }
}

/* ---- Bus details tabs ---- */
@media only screen and (max-width: 768px) {
  .wbtm_bus_details_tabs_holder {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    padding: 5px;
  }
  .wbtm_bus_details_tabs_holder > * {
    flex-shrink: 0;
  }
}

/* ---- Single bus feature image ---- */
@media only screen and (max-width: 600px) {
  .wbtm_car_details_feature_image {
    width: 100% !important;
    max-width: 100% !important;
  }
  .wbtm_car_details_gallery img {
    width: 70px !important;
    height: 56px !important;
  }
}

/* ---- General overflow guard ---- */
@media only screen and (max-width: 768px) {
  .wbtm_style {
    overflow-x: hidden;
  }
  #wbtm_area {
    overflow-x: hidden;
  }
}

/* Editable Return Route (Pro): style the return From/To selectors to match the
   plugin's main search inputs (boxed input with an inline marker icon), and show
   the locked "From" (fixed to the outbound destination) as read-only. */
.wbtm_return_route_selectors {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px;
  width: 100%;
  margin: 12px 0 10px;
  padding: 12px 14px;
  background-color: var(--wbtm_color_white, #ffffff);
  border: 1px solid var(--wbtm_color_border, #e5e7eb);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  box-sizing: border-box;
}
.wbtm_return_route_selectors .wtbm_inputList {
  position: relative;
  flex: 1 1 calc(50% - 10px);
  min-width: 180px;
  margin: 0;
}
.wbtm_return_route_selectors .wtbm_fdColumn {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 4px;
  font-size: var(--wbtm_fs_label, 14px);
  color: #555;
}
.wbtm_return_route_selectors .marker {
  position: relative;
}
.wbtm_return_route_selectors .marker > i.fa-map-marker-alt {
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  color: #999;
  font-size: 14px;
  pointer-events: none;
}
.wbtm_return_route_selectors input.formControl {
  width: 100%;
  height: 44px;
  padding: 0 14px 0 32px;
  font-size: 16px;
  color: #333;
  background-color: var(--wbtm_color_white, #ffffff);
  border: 1px solid #7d7979;
  border-radius: 6px;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.wbtm_return_route_selectors input.formControl:focus {
  border-color: var(--wbtm_color_theme, #2271b1);
  box-shadow: 0 0 0 2px rgba(34, 113, 177, 0.12);
}
/* Locked "From" — read-only, with a lock icon on the right. */
.wbtm_return_route_selectors .wbtm_return_from_fixed input.formControl {
  padding-right: 30px;
  cursor: not-allowed;
  background-color: #f4f5f7;
  color: #555;
  pointer-events: none;
}
.wbtm_return_route_selectors .wbtm_return_from_fixed .wbtm_return_from_lock {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: #9aa0a6;
  pointer-events: none;
}
/* Reuse the main search dropdown look for the editable "To" list. */
.wbtm_return_route_selectors ul.wbtm_input_select_list {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .wbtm_return_route_selectors .wtbm_inputList {
    flex: 1 1 100%;
  }
}

/* Available / Selected / Booked legend, shown below .wbtm_seat_plan_area. */
.wbtm_seat_legend {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
  margin: 4px 10px 20px;
  padding-top: 18px;
  border-top: 1px solid #eef1f5;
}
.wbtm_seat_legend_item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  line-height: 1;
  color: #64748b;
  white-space: nowrap;
}
.wbtm_seat_legend_swatch {
  width: 13px;
  height: 13px;
  min-width: 13px;
  border-radius: 3px;
  display: inline-block;
  box-sizing: border-box;
  flex-shrink: 0;
  font-style: normal;
  vertical-align: middle;
}
.wbtm_seat_legend_swatch.is_available {
  /* A near-white fill with a visible border reads as ill-defined/misaligned
     against the page's own white background — tinted very slightly so it
     shows up as a clear, consistently-sized square like the other two. */
  background: #f1f5f9;
  border: 1.5px solid #cbd5e1;
}
.wbtm_seat_legend_swatch.is_selected {
  background: #ef4444;
  border: 1.5px solid #ef4444;
}
.wbtm_seat_legend_swatch.is_booked {
  background: #cbd5e1;
  border: 1.5px solid #cbd5e1;
}

/* ==================================================================== *
 *  Booking summary column redesign — selected seats, totals, pickup /
 *  drop-off, extra services, passenger info and the Book Now footer
 *  (the right-hand column of the seat-booking form). Each section is
 *  scoped to its own existing wrapper class. Shared component classes also
 *  reused elsewhere in the plugin (.mpPanel_xs, .mpPanelHeader,
 *  .mpPanelBody, .qtyIncDec, .groupContent, .mp_form_item) are always
 *  qualified with a wrapper from this column (e.g. ".wbtm_attendee_area
 *  .mpPanel_xs") so nothing here leaks into admin settings pages or other
 *  frontend areas that reuse those same classes. !important is used only
 *  on the box-model properties (background/border/padding/margin/radius)
 *  that the classic [class*="_dLayout"]/[class*="_bgLight"] utility
 *  classes already set on these same elements. *
 * ==================================================================== */

/* ---- Selected-seats table / totals table — hidden, not removed ----
   Both are now redundant on-screen (the "Booking Summary" preview card
   shows the same seat list + subtotal), but .wbtm_selected_seat_details
   .wbtm_item_insert and .wbtm_sub_total are the live elements
   wbtm_selected_seat_details()/wbtm_price_calculation() in wbtm_global.js
   read from and write to on every seat click — and the exact source
   wbtm_update_summary_preview() mirrors into the preview card. Removing
   this markup from the template would break seat tracking and price
   calculation everywhere, not just this duplicate display, so it's hidden
   with CSS instead; the DOM keeps working exactly as before. */
.wbtm_selected_seat_details,
table.wbtm_totals {
  display: none !important;
}

/* ---- Bottom Total/Book Now footer — hidden, not removed ----
   Same reasoning as above: the "Booking Summary" preview card now shows the
   total and its own Book Now button, but #wbtm_add_to_cart here is the real
   button that button re-triggers via .trigger('click') (see the click
   handler for .wbtm_summary_preview_book_now in wbtm_global.js), and
   .wbtm_total is what wbtm_price_calculation() writes the grand total (incl.
   extra services) and data-raw-total into. jQuery's .trigger('click') still
   fires a hidden element's click handler, so hiding this with CSS rather
   than removing it from the template keeps the preview's button working. */
/* Hidden until a ticket quantity / seat is chosen. No !important here on
   purpose: wbtm_price_calculation() (wbtm_global.js) reveals this footer via
   jQuery .slideDown(), which sets an inline display that must be able to win
   over this rule. The without-seat-plan flow has no Booking Summary preview
   card, so this footer is its ONLY Book Now button and must stay revealable. */
.wbtm_form_submit_area {
  display: none;
}

/* Seat-plan flow renders a Booking Summary preview card whose own Book Now
   button re-triggers the hidden #wbtm_add_to_cart, so the real submit footer
   is kept permanently hidden there to avoid a duplicate button. !important
   scoped to that flow blocks the shared slideDown() from revealing it — the
   without-seat-plan flow (no preview card) is unaffected. */
.wbtm_registration_area:has(.wbtm_booking_summary_preview) .wbtm_form_submit_area {
  display: none !important;
}

/* ---- Shared card shell for every section in this column ----
   .wbtm_pickup_point deliberately NOT included here — Pickup Point and
   Drop-Off Point are merged into one shared card (.wbtm_location_points_card
   below) instead of getting one each. */
.wbtm_selected_seat_details,
table.wbtm_totals,
.wbtm_ex_service_area,
.wbtm_attendee_area .wbtm_attendee_item,
.wbtm_form_submit_area {
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
  padding: 18px !important;
  margin: 0 0 16px !important;
  box-sizing: border-box;
}
.wbtm_attendee_area .wbtm_attendee_item + .wbtm_attendee_item {
  margin-top: 16px !important;
}

/* ---- Selected seat(s) — table reshaped into a compact line-item list ---- */
.wbtm_selected_seat_details table thead {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.wbtm_selected_seat_details table,
.wbtm_selected_seat_details tbody.wbtm_item_insert {
  display: block;
  width: 100%;
}
.wbtm_selected_seat_details tbody.wbtm_item_insert {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wbtm_selected_seat_details tr.wbtm_remove_area {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f8fafc;
  border: 1px solid #eef1f5 !important;
  border-radius: 10px;
  padding: 9px 12px;
}
.wbtm_selected_seat_details tr.wbtm_remove_area td {
  border: 0 !important;
  padding: 0 !important;
}
.wbtm_selected_seat_details td.insert_seat_label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--wbtm_color_theme);
  background: var(--wbtm_color_theme_alter, #fff1f4);
  border-radius: 999px;
  padding: 4px 10px;
  flex: 0 0 auto;
}
.wbtm_selected_seat_details td.insert_seat_name {
  font-weight: 700;
  color: #1f2937;
  flex: 1 1 auto;
}
.wbtm_selected_seat_details td.insert_seat_price {
  font-weight: 700;
  color: #1f2937;
  flex: 0 0 auto;
}
.wbtm_selected_seat_details tr.wbtm_remove_area .allCenter,
.wbtm_selected_seat_details tr.wbtm_remove_area .wbtm_item_remove {
  flex: 0 0 auto;
}
.wbtm_selected_seat_details .wbtm_item_remove {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  background: #fff;
  border: 1px solid #eef1f5;
  color: #ef4444;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.wbtm_selected_seat_details .wbtm_item_remove:hover {
  background: #fef2f2;
}

/* ---- Totals table — a clean flex row instead of a bordered grid ---- */
table.wbtm_totals tbody,
table.wbtm_totals tr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
table.wbtm_totals td {
  border: 0 !important;
  padding: 0 !important;
}
table.wbtm_totals h5 {
  margin: 0;
  font-size: 15px !important;
  color: #64748b !important;
  font-weight: 600;
}
table.wbtm_totals .wbtm_sub_total {
  color: #1f2937 !important;
  font-weight: 700;
}

/* ---- Pickup / Drop-off point — merged into ONE shared card ----
   Pickup Point and Drop-Off Point are two separate templates
   (templates/layout/pickup_point.php, drop_off_point.php), each rendering
   its own <div class="wbtm_pickup_point _bgLight ...">, and each only
   conditionally (a bus may have only one of the two enabled). Rather than
   editing both templates, they're wrapped in one new
   .wbtm_location_points_card container (see registration_seat_plan.php)
   which gets the card shell instead of each .wbtm_pickup_point getting its
   own; the individual sections are stripped back to flush, borderless
   blocks with a divider between them when both are present. */
.wbtm_location_points_card {
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
  padding: 18px !important;
  margin: 0 0 16px !important;
  box-sizing: border-box;
}
.wbtm_location_points_card .wbtm_pickup_point {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
.wbtm_location_points_card .wbtm_pickup_point + .wbtm_pickup_point {
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid #eef1f5 !important;
}
.wbtm_pickup_point label.justifyBetween {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 6px;
}
.wbtm_pickup_point label span {
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.wbtm_pickup_point select.formControl {
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  font-size: 13.5px !important;
  background-color: #f8fafc !important;
}
.wbtm_pickup_point select.formControl:focus {
  border-color: var(--wbtm_color_theme) !important;
  background-color: #fff !important;
}

/* ---- Extra services — line items with a pill quantity stepper ----
   Styled to match the passenger-information card: the shared 18px card
   padding is zeroed out so the tinted header band (the h3) can bleed
   edge-to-edge, with the padding moved onto the .mpPanel body instead. */
.wbtm_ex_service_area {
  padding: 0 !important;
  border: 1px solid #e7eaf0 !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 28px -20px rgba(2, 6, 23, .28);
  overflow: hidden;
}
/* Thin brand accent bar along the top edge of the card. */
.wbtm_ex_service_area::before {
  content: "";
  display: block;
  height: 4px;
  background: linear-gradient(90deg, var(--wbtm_color_theme, #2563eb), var(--wbtm_color_theme_alter, #93c5fd));
}
.wbtm_ex_service_area h3 {
  text-transform: uppercase;
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  letter-spacing: .01em;
  background: linear-gradient(180deg, #f8fafc, #f1f5f9);
  border-bottom: 1px solid #e7eaf0 !important;
  padding: 14px 18px !important;
}
.wbtm_ex_service_area .mpPanel {
  border: 0;
  background: #fff;
  padding: 18px;
}
.wbtm_style .wbtm_ex_service_area .mT {
  margin-top: 0px;
}
.wbtm_ex_service_area table thead {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.wbtm_ex_service_area table,
.wbtm_ex_service_area tbody {
  display: block;
  width: 100%;
}
.wbtm_ex_service_area tbody {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wbtm_ex_service_area tbody tr {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 11px 14px;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, .03);
  transition: border-color .15s ease;
}
.wbtm_ex_service_area tbody tr:hover {
  border-color: #cbd5e1;
}
.wbtm_ex_service_area tbody td {
  border: 0 !important;
  padding: 0 !important;
}
.wbtm_ex_service_area td._textLeft {
  flex: 1 1 auto;
  font-weight: 700;
  color: #0f172a;
  font-size: 14px;
  text-align: left !important;
}
.wbtm_ex_service_area td._textCenter {
  flex: 0 0 auto;
  text-align: center !important;
}
/* Swap visual order so Price sits to the left of the Quantity stepper — the
   markup order (Name, Quantity, Price) is unchanged, this just reorders how
   the row paints. Uses nth-child (fixed structural position), not :has(),
   so it isn't at risk of the DOM-mutation reflow issue fixed for the
   Passenger Information fields (the quantity stepper's +/- buttons only
   change the input's value, they don't add/remove/re-tag DOM nodes). */
.wbtm_ex_service_area tbody td:nth-child(2) { order: 3; }
.wbtm_ex_service_area tbody td:nth-child(3) { order: 2; }
/* Unit price rendered as a small white pill badge, like the seat badge on
   the passenger card header. */
.wbtm_ex_service_area td._textCenter .woocommerce-Price-amount {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  font-size: 12.5px;
  color: var(--wbtm_color_theme);
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 3px 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
}
.wbtm_ex_service_area .qtyIncDec {
  background: #fff;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
}
.wbtm_ex_service_area .qtyIncDec .addonGroupContent {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  cursor: pointer;
  border: 0 !important;
  transition: background-color .15s ease, color .15s ease;
}
.wbtm_ex_service_area .qtyIncDec .addonGroupContent:hover {
  background: var(--wbtm_color_theme, #2563eb);
  color: #fff;
}
.wbtm_ex_service_area .qtyIncDec input.formControl {
  width: 40px !important;
  height: 28px;
  border: 0 !important;
  text-align: center;
  font-weight: 700;
  padding: 0 !important;
  background: transparent !important;
}

/* ---- Passenger information ---- */
/* The shared card shell above pads every summary-column card 18px on all
   sides; the passenger card zeroes that out so its tinted header can bleed
   edge-to-edge, with the padding moved onto .mpPanelBody instead. */
.wbtm_attendee_area .wbtm_attendee_item {
  padding: 0 !important;
  border: 1px solid #e7eaf0 !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 28px -20px rgba(2, 6, 23, .28);
  overflow: hidden;
}
/* Thin brand accent bar along the top edge of the card. */
.wbtm_attendee_area .wbtm_attendee_item::before {
  content: "";
  display: block;
  height: 4px;
  background: linear-gradient(90deg, var(--wbtm_color_theme, #2563eb), var(--wbtm_color_theme_alter, #93c5fd));
}
.wbtm_attendee_area .mpPanelHeader {
  background: linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
  border: 0 !important;
  border-bottom: 1px solid #e7eaf0 !important;
  padding: 14px 18px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px;
}
.wbtm_attendee_header_text {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.wbtm_attendee_area .mpPanelHeader h5 {
  margin: 0;
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  letter-spacing: .01em;
  text-transform: uppercase;
}
/* Seat assignment rendered as a small white pill badge under the title. */
.wbtm_attendee_seat_label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: max-content;
  font-size: 11.5px;
  font-weight: 600;
  color: #64748b;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 3px 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
  text-transform: none !important;
  letter-spacing: normal !important;
}
.wbtm_attendee_area .mpPanelHeader .wbtm_seat_name {
  font-weight: 800;
  color: var(--wbtm_color_theme);
}
/* Round person+pencil avatar, right side of the header — purely decorative. */
.wbtm_attendee_header_icon {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M4 20c0-3.3 2.5-5.5 5.5-5.5'/%3E%3Cpath d='M15.5 20.5l4-4a1.4 1.4 0 0 0-2-2l-4 4-.6 2.6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px;
}
.wbtm_attendee_area .mpPanelBody {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px;
  /* Card shell padding was zeroed so the header could bleed edge-to-edge;
     the body carries it instead. */
  padding: 18px !important;
  background: #fff !important;
}
.wbtm_attendee_area .mp_form_item {
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 6px;
  /* Grid items default to min-width:auto, which refuses to shrink below
     the item's own content size (e.g. the uppercase "PASSENGER ADDRESS"
     label) — that alone can make the two 1fr tracks render at visibly
     different widths even though they're an equal fr share. min-width:0
     lets both columns actually end up equal, and width:100% stops this
     flex column from shrink-wrapping instead of filling its grid track. */
  width: 100% !important;
  min-width: 0 !important;
}
.wbtm_attendee_area .mp_form_item span {
  font-size: 11.5px;
  font-weight: 700;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.wbtm_attendee_area .mp_form_item .textRequired {
  color: #ef4444;
  font-weight: 700;
}
.wbtm_attendee_area .mp_form_item .formControl {
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 11px 14px !important;
  font-size: 14px !important;
  color: #0f172a !important;
  background-color: #f8fafc !important;
  background-repeat: no-repeat !important;
  background-position: 12px center !important;
  background-size: 16px !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, .03);
  transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.wbtm_attendee_area .mp_form_item .formControl::placeholder {
  color: #94a3b8;
}
.wbtm_attendee_area .mp_form_item .formControl:hover {
  border-color: #cbd5e1 !important;
}
/* The blanket padding:10px 12px !important above clobbers the legacy
   calendar icon's own padding-left:40px (div.wbtm_style .formControl.date_type
   in wbtm_plugin_global.css, not !important, so it lost) — collapsing the
   left padding back to 12px let the icon overlap the "D" in "Date of Birth".
   Restored here, scoped to this form only. */
.wbtm_attendee_area .mp_form_item .formControl.date_type {
  padding-left: 40px !important;
}
.wbtm_attendee_area .mp_form_item .formControl:focus {
  border-color: var(--wbtm_color_theme) !important;
  background-color: #fff !important;
  outline: 0 !important;
  /* Soft focus ring in the theme color (falls back to blue). */
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--wbtm_color_theme, #2563eb) 15%, transparent);
}
.wbtm_attendee_area .mp_form_item:has(textarea) {
  grid-column: 1 / -1;
}
/* Field order (Name, Email, Phone, DOB, Gender, Address) is now handled by
   physically moving the DOM nodes once in JS — see wbtm_reorder_attendee_fields()
   in wbtm_global.js. A CSS `order` + :has() version of this lived here
   before, but interacting with the Date of Birth datepicker mutated the DOM
   enough to re-trigger :has() and visibly reshuffle the grid (Passenger Name
   and Date of Birth would swap on screen). Real DOM order isn't affected by
   that.
   Icon prefixes — matched by field name so no PHP template changes were
   needed; each icon is a small inline SVG (not an icon font) so it renders
   the same regardless of whether Font Awesome/Dashicons load on this page.
   Selectors include .mp_form_item (not just .wbtm_attendee_area + the field)
   so their specificity (0,3,1) beats .wbtm_attendee_area .mp_form_item
   .formControl's padding:10px 12px !important (0,3,0) above — both are
   !important, so without that extra class here padding-left silently lost
   and the icon ended up drawn on top of the placeholder text. */
.wbtm_attendee_area .mp_form_item input[name="wbtm_full_name[]"] {
  padding-left: 36px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.2'/%3E%3Cpath d='M5 20c0-3.5 3-6 7-6s7 2.5 7 6'/%3E%3C/svg%3E") !important;
  background-position: 12px center !important;
}
.wbtm_attendee_area .mp_form_item input[name="wbtm_reg_email[]"] {
  padding-left: 36px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E") !important;
  background-position: 12px center !important;
}
.wbtm_attendee_area .mp_form_item input[name="wbtm_reg_phone[]"] {
  padding-left: 36px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.6 3.5h2.7l1.5 4-2 1.4a10.8 10.8 0 0 0 5.3 5.3l1.4-2 4 1.5v2.7a1.8 1.8 0 0 1-2 1.8C11 17.4 6.6 13 5.8 6.5a1.8 1.8 0 0 1 1.8-2z'/%3E%3C/svg%3E") !important;
  background-position: 12px center !important;
}
.wbtm_attendee_area .mp_form_item select[name="wbtm_user_gender[]"] {
  padding-left: 36px !important;
  -webkit-appearance: none;
  appearance: none;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='7' r='2.6'/%3E%3Ccircle cx='16' cy='9.5' r='2.2'/%3E%3Cpath d='M4 20c0-3 2.2-5.2 5-5.2s5 2.2 5 5.2M13.6 20c.3-2 1.8-3.5 3.6-3.8'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-position: 12px center, right 12px center !important;
  background-repeat: no-repeat, no-repeat !important;
  background-size: 16px, 14px !important;
  padding-right: 34px !important;
}
.wbtm_attendee_area .mp_form_item textarea[name="wbtm_reg_address[]"] {
  padding-left: 36px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.5 7-11a7 7 0 1 0-14 0c0 4.5 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.3'/%3E%3C/svg%3E") !important;
  background-position: 12px 12px !important;
  background-repeat: no-repeat !important;
}
/* Date of birth already gets a calendar icon from the classic
   div.wbtm_style .formControl.date_type rule (wbtm_plugin_global.css) —
   left as-is rather than duplicated here. */
@media only screen and (max-width: 600px) {
  .wbtm_attendee_area .mpPanelBody {
    grid-template-columns: 1fr;
  }
}

/* ---- Footer: total + Book Now ---- */
.wbtm_form_submit_area {
  position: sticky;
  bottom: 12px;
}
.wbtm_form_submit_area .justifyBetween {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.wbtm_form_submit_area h5 {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: #64748b;
}
.wbtm_form_submit_area .wbtm_total {
  display: block;
  margin-top: 2px;
  font-size: 22px;
  font-weight: 800;
}
#wbtm_add_to_cart {
  border: 0;
  border-radius: 999px;
  padding: 14px 32px !important;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .02em;
  background: var(--wbtm_color_theme);
  color: var(--wbtm_color_theme_alter);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
  transition: filter .15s, transform .15s;
  cursor: pointer;
}
#wbtm_add_to_cart:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
}
@media only screen and (max-width: 600px) {
  .wbtm_form_submit_area .justifyBetween {
    flex-direction: column;
    align-items: stretch;
  }
  #wbtm_add_to_cart {
    width: 100%;
  }
}

/* ==================================================================== *
 *  Booking Summary preview card (templates/layout/booking_summary_preview.php)
 *  A second, read-only summary shown right after Drop-Off Point — mirrors
 *  the live seat list/subtotal (see wbtm_update_summary_preview() in
 *  wbtm_global.js) and its Book Now button just re-triggers the real
 *  #wbtm_add_to_cart button below, so nothing here duplicates cart logic.
 * ==================================================================== */
.wbtm_booking_summary_preview {
  background: #eef2ff;
  border: 1px solid #e0e7ff;
  border-radius: 14px;
  padding: 18px;
  margin: 0 0 16px;
  box-sizing: border-box;
}
.wbtm_booking_summary_title {
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 700;
  color: #1e3a8a;
}
.wbtm_booking_summary_route {
  margin: 0 0 15px !important;
  font-size: 12.5px;
  color: #4f5ea3;
}
.wbtm_booking_summary_table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 12px;
}
.wbtm_booking_summary_table thead th {
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #6b7280;
  padding: 0 0 8px;
  border-bottom: 1px solid #e0e7ff;
}
.wbtm_booking_summary_table tbody td {
  padding: 8px 0;
  font-size: 13px;
  border-bottom: 1px solid #e5e9ff;
}
.wbtm_booking_summary_table tbody td:first-child {
  color: #f97316;
  padding: 10px;
  font-weight: 700;
}
.wbtm_booking_summary_table tbody td:nth-child(2) {
  font-weight: 700;
  color: #1f2937;
}
.wbtm_booking_summary_table tbody td:last-child {
  text-align: right;
  padding: 10px;
  font-weight: 700;
  color: #1f2937;
}
/* "No seat selected yet" placeholder row (see booking_summary_preview.php /
   wbtm_update_summary_preview()) — its lone <td> would otherwise inherit the
   seat-type column's orange first-child styling above. */
.wbtm_booking_summary_table tbody tr.wbtm_summary_preview_empty_row td {
  text-align: center !important;
  font-weight: 400 !important;
  color: #9ca3af !important;
  font-style: italic;
}
.wbtm_booking_summary_subtotal {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  font-size: 13.5px;
  font-weight: 600;
  color: #374151;
  margin-top: 15px;
  margin-bottom: 14px;
}
.wbtm_booking_summary_subtotal .wbtm_summary_preview_subtotal {
  font-size: 17px;
  font-weight: 800;
  color: #1e3a8a;
}
/* Extra-service breakdown between the ticket subtotal and the grand total (see
   booking_summary_preview.php / wbtm_update_summary_services()). Deliberately
   plain: one line per service, no heading and no rule of its own. The service
   names say what the lines are, and sitting between "Ticket Sub total" and
   "Total Price" says where they belong — a heading plus a repeated subtotal
   turned one $50 add-on into three rows of card. */
.wbtm_summary_preview_services {
  margin: -8px 0 12px;
}
.wbtm_summary_preview_service_row {
  display: flex !important;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
  font-weight: 500;
  color: #4b5563;
  margin-bottom: 5px;
}
.wbtm_summary_preview_service_row .wbtm_summary_service_name {
  min-width: 0;
  word-break: break-word;
}
.wbtm_summary_preview_service_row .wbtm_summary_service_name small {
  margin-left: 5px;
  color: #6b7280;
  font-weight: 600;
}
.wbtm_summary_preview_service_row .wbtm_summary_service_price {
  flex: none;
  font-weight: 700;
  color: #1f2937;
  white-space: nowrap;
}
/* Shown only when more than one service was taken (see the JS) — under a single
   line it would just repeat the amount above it. */
.wbtm_summary_preview_services .wbtm_summary_services_subtotal {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin: 7px 0 0;
  padding-top: 7px;
  border-top: 1px dashed #e5e7eb;
}
.wbtm_summary_preview_services .wbtm_summary_preview_services_total {
  flex: none;
  font-size: 14px;
  font-weight: 800;
  color: #1e3a8a;
  white-space: nowrap;
}
.wbtm_booking_summary_total {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 14px;
  padding-top: 12px;
  border-top: 1px dashed #e0e7ff;
}
.wbtm_booking_summary_total .wbtm_summary_preview_total {
  font-size: 19px;
  font-weight: 800;
  color: #1e3a8a;
}
.wbtm_summary_preview_book_now {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 10px;
  padding: 13px 20px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .02em;
  background-color: var(--wbtm_color_theme);
  color: #fff;
  cursor: pointer;
  transition: filter .15s;
}
.wbtm_summary_preview_book_now:hover {
  filter: brightness(1.08);
}
.wbtm_summary_preview_book_now:disabled {
  background: #cbd5e1;
  color: #f8fafc;
  cursor: not-allowed;
}
.wbtm_summary_preview_book_now:disabled:hover {
  filter: none;
}
.wbtm_booking_summary_note {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 0 0;
  margin-top: 15px !important;
  padding: 10px 12px;
  background: #ecfdf5;
  border: 1px solid #71d1a0;
  border-radius: 10px;
  font-size: 12px;
  color: #047857;
}
.wbtm_booking_summary_note::before {
  content: "✓";
  flex: 0 0 auto;
  font-weight: 700;
}
.wbtm_registration_area ._dLayout_xs {
  border-radius: 10px;
}
.wbtm_registration_area .mpPanel {
  border: none !important;
}
/* Desktop-only: widen the seat-plan column slightly. Was previously wrapped
   in (min-width: 10px), which applied at ALL widths and — because this
   selector out-specifies the responsive .col_12_800 / .col_12_700 grid
   classes — locked the seat plan to 38% width on phones, squeezing the seat
   grid and pushing the summary column off-screen. Scoped to >1000px so the
   col_5_1000 / col_6_900 / col_12_800 breakpoints work again. */
@media only screen and (min-width: 1001px) {
  .wbtm_style .wbtm_registration_area .col_4 {
    width: 38%;
  }
}

/* ---- Mobile: expanded seat-plan / booking view ---- */
@media only screen and (max-width: 800px) {
  /* Stack the seat-plan column and the summary column full-width, whatever
     grid class combination the templates use. */
  .wbtm_style .wbtm_registration_area .mpRow.justifyBetween > [class*="col_"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
  /* Wide seat layouts (many columns / double-decker) scroll inside their
     card instead of overflowing the viewport. */
  .wbtm_style .wbtm_seat_plan_area {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .wbtm_style .wbtm_seat_plan_area table {
    margin-left: auto;
    margin-right: auto;
  }
  /* The white card around the seat grid: trim side padding so the seat
     grid gets the full phone width. */
  .wbtm_style .wbtm_registration_area ._dLayout_xs {
    padding-left: 10px;
    padding-right: 10px;
  }
  /* Legend sits inside the same card — keep it inside the card width and
     let items wrap instead of forcing a wider box. */
  .wbtm_style .wbtm_seat_legend {
    margin-left: 0;
    margin-right: 0;
    gap: 10px 14px;
  }
}

/* The small inline loader (e.g. the "To" field while its Drop-Off Point
   options load) inherits a dark semi-transparent background from the
   generic div[class*="wbtm_loader"] rule in wbtm_plugin_global.css, which
   is shared with the big full-area loader used elsewhere (search results,
   etc). Scoped to just .wbtm_loader_xs so only this small spinner loses its
   background — the bigger loader's dimming overlay elsewhere is untouched. */
div.wbtm_loader_xs {
  background: transparent !important;
}

/* Seat-hold countdown badge (WBTM_Seat_Hold): shown in the selected-seat
   summary while the customer's seats are temporarily held. */
.wbtm_style .wbtm_registration_area .wbtm_hold_badge {
  margin-top: 8px;
  padding: 6px 10px;
  border-radius: 4px;
  background: #e8f4e8;
  border: 1px solid #2e7d32;
  color: #2e7d32;
  font-weight: 600;
  text-align: center;
}
.wbtm_style .wbtm_registration_area .wbtm_hold_badge--urgent {
  background: #fdecea;
  border-color: #c62828;
  color: #c62828;
}

/* Lower/Upper deck switch inside a double-decker cabin/coach */
.wbtm_style .wbtm_cabin_deck_tabs {
  display: flex;
  gap: 6px;
  padding: 10px 12px 0;
}
.wbtm_style .wbtm_cabin_deck_tab {
  flex: 1 1 auto;
  padding: 8px 12px;
  border: 1px solid #d7dce3;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  background: #f4f6f9;
  color: #55606e;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.wbtm_style .wbtm_cabin_deck_tab:hover {
  background: #eaeef3;
}
.wbtm_style .wbtm_cabin_deck_tab.wbtm_cabin_deck_tab_active {
  background: #fff;
  color: #1f2733;
  border-color: #c9d2dc;
  box-shadow: 0 -2px 0 0 #2d7ff9 inset;
}
.wbtm_style .wbtm_deck_pane {
  border-top: 1px solid #e4e9ef;
}