/* ═══════════════════════════════════════════════════
   FTS V2 — 4-Step Wizard Booking Modal (Compact)
   Step 1: Date → Step 2: Travelers → Step 3: Package → Step 4: Review & Book
   ═══════════════════════════════════════════════════ */

/* Hide default WTE modal */
#wptravelengine-trip-booking-modal { display: none !important; }

/* ─── Overlay ─── */
.fts-bm-overlay {
  display: none !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  background: rgba(0,0,0,.55) !important;
  justify-content: center !important;
  align-items: flex-end !important;
}
.fts-bm-overlay.active {
  display: flex !important;
}

/* ─── Container ─── */
.fts-bm-container {
  position: relative !important;
  width: 100% !important;
  max-width: 520px !important;
  max-height: 96vh !important;
  background: #fff !important;
  border-radius: 20px 20px 0 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  animation: ftsBmSlideUp .3s ease-out !important;
  box-sizing: border-box !important;
}
#fts-booking-modal *,
#fts-booking-modal *::before,
#fts-booking-modal *::after {
  box-sizing: border-box !important;
}
@keyframes ftsBmSlideUp {
  from { transform: translateY(40px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}
@keyframes ftsBmSlideUpFs {
  from { transform: translateY(12px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* ─── HEADER ─── */
.fts-bm-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 16px 10px !important;
  background: #1e293b !important;
  color: #fff !important;
}
.fts-bm-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}
.fts-bm-plane-icon {
  width: 24px !important;
  height: 24px !important;
  flex-shrink: 0 !important;
  stroke: #ff6b35 !important;
}
.fts-bm-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: break-word !important;
}
.fts-bm-subtitle {
  font-size: 11px !important;
  color: #94a3b8 !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;
}
.fts-bm-close {
  width: 28px !important;
  height: 28px !important;
  border: none !important;
  background: transparent !important;
  color: #94a3b8 !important;
  font-size: 22px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  border-radius: 6px !important;
  padding: 0 !important;
  margin: 0 !important;
  transition: background .15s !important;
}
.fts-bm-close:hover { background: rgba(255,255,255,.1) !important; color: #fff !important; }

/* ─── TRUST BAR ─── */
.fts-bm-trust-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  font-size: 11px !important;
  color: #475569 !important;
}
.fts-bm-trust-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
}
.fts-bm-trust-cancel { color: #16a34a !important; font-weight: 600 !important; }
.fts-bm-trust-sep { color: #cbd5e1 !important; }

/* ─── PROGRESS BAR ─── */
.fts-bm-progress {
  padding: 8px 16px 4px !important;
  background: #fff !important;
}
.fts-bm-progress-track {
  display: flex !important;
  gap: 3px !important;
  height: 3px !important;
  border-radius: 3px !important;
  overflow: hidden !important;
}
.fts-bm-progress-seg {
  flex: 1 !important;
  background: #e2e8f0 !important;
  border-radius: 3px !important;
  transition: background .3s !important;
}
.fts-bm-progress-seg.active { background: var(--v2-primary, #ff6b35) !important; }
.fts-bm-progress-seg.done   { background: #16a34a !important; }

.fts-bm-progress-labels {
  display: flex !important;
  justify-content: space-between !important;
  margin-top: 4px !important;
  font-size: 10px !important;
  color: #94a3b8 !important;
  font-weight: 500 !important;
}
.fts-bm-progress-labels span { margin: 0 !important; padding: 0 !important; }
.fts-bm-progress-labels span.active { color: var(--v2-primary, #ff6b35) !important; font-weight: 700 !important; }
.fts-bm-progress-labels span.done   { color: #16a34a !important; }

/* ─── URGENCY BAR ─── */
.fts-bm-urgency {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  background: #166534 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
.fts-bm-urgency svg { stroke: #fbbf24 !important; }
.fts-bm-urgency-dot { opacity: .5 !important; }

/* ─── SCROLLABLE BODY ─── */
.fts-bm-body {
  flex: 1 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 6px 12px 20px !important;
  -webkit-overflow-scrolling: touch !important;
}

/* ══════════════════════════════════════════
   STEP ACCORDION
   ══════════════════════════════════════════ */
.fts-bm-step {
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  margin-bottom: 6px !important;
  background: #fff !important;
  overflow: hidden !important;
  transition: box-shadow .2s !important;
  padding: 0 !important;
}
.fts-bm-step.active {
  border-color: var(--v2-primary, #ff6b35) !important;
  box-shadow: 0 0 0 1.5px rgba(255,107,53,.1) !important;
}

/* Step Head */
.fts-bm-step-head {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  cursor: default !important;
  user-select: none !important;
  margin: 0 !important;
}
.fts-bm-step.completed .fts-bm-step-head { cursor: pointer !important; }

/* Step Circle */
.fts-bm-step-circle {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  background: #e2e8f0 !important;
  transition: background .2s !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-step.active .fts-bm-step-circle    { background: var(--v2-primary, #ff6b35) !important; }
.fts-bm-step.completed .fts-bm-step-circle { background: #16a34a !important; }

.fts-bm-step-num {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-step.active .fts-bm-step-num    { color: #fff !important; }
.fts-bm-step.completed .fts-bm-step-num { display: none !important; }

.fts-bm-step-check { display: none !important; }
.fts-bm-step-check svg { width: 14px !important; height: 14px !important; }
.fts-bm-step.completed .fts-bm-step-check { display: block !important; }

/* Step Title */
.fts-bm-step-title {
  flex: 1 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-step-label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-step.locked .fts-bm-step-label { color: #94a3b8 !important; }

.fts-bm-step-summary {
  display: none !important;
  font-size: 11px !important;
  color: #16a34a !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
}
.fts-bm-step.completed .fts-bm-step-summary { display: block !important; }

/* Edit Link */
.fts-bm-step-edit {
  display: none !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--v2-primary, #ff6b35) !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  padding: 2px 6px !important;
  margin: 0 !important;
}
.fts-bm-step.completed .fts-bm-step-edit { display: inline !important; }
.fts-bm-step-edit:hover { text-decoration: underline !important; }

/* Chevron */
.fts-bm-step-chevron {
  flex-shrink: 0 !important;
  transition: transform .2s !important;
  color: #94a3b8 !important;
  width: 14px !important;
  height: 14px !important;
}
.fts-bm-step.active .fts-bm-step-chevron { transform: rotate(180deg) !important; color: var(--v2-primary, #ff6b35) !important; }
.fts-bm-step.completed .fts-bm-step-chevron,
.fts-bm-step.locked .fts-bm-step-chevron { color: #cbd5e1 !important; }

/* Step Body */
.fts-bm-step-body {
  display: none !important;
  padding: 0 12px 12px !important;
  margin: 0 !important;
}
.fts-bm-step.active .fts-bm-step-body { display: block !important; }

/* ─── CONTINUE BUTTON ─── */
.fts-bm-continue {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 10px 20px !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  border: none !important;
  border-radius: 10px !important;
  background: var(--v2-primary, #ff6b35) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .15s, opacity .15s !important;
  line-height: 1.3 !important;
}
.fts-bm-continue:hover { background: #e5622f !important; }
.fts-bm-continue:disabled,
.fts-bm-continue[disabled] {
  background: #cbd5e1 !important;
  cursor: not-allowed !important;
  color: #fff !important;
}

/* ══════════════════════════════════════════
   STEP 1: DATE (inline calendar only; #fts-bm-date-input is type=hidden for JS)
   ══════════════════════════════════════════ */
.fts-bm-date-wrapper.fts-bm-date-wrapper--inline-cal {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
#fts-bm-step-1 .fts-bm-step-body {
  width: 100% !important;
  max-width: 100% !important;
}
.fts-bm-date-hint {
  font-size: 12px !important;
  color: #64748b !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  line-height: 1.4 !important;
}

/* jQuery UI — legacy popup (rare) */
#ui-datepicker-div.fts-bm-dp-active {
  z-index: 10000000 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  border-radius: 16px !important;
  border: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  padding: 12px !important;
  box-shadow: 0 16px 48px rgba(15, 23, 42, 0.14) !important;
}

/* Card: inline calendar + legend — stretch so calendar fills blue area (not 17em-centered) */
.fts-bm-cal-card {
  margin-top: 0 !important;
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 16px 12px 14px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}
.fts-bm-cal-card > .fts-bm-datepicker-wrap {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  display: block !important;
  box-sizing: border-box !important;
}
.fts-bm-datepicker-wrap #fts-bm-datepicker-inline {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.fts-bm-cal-card .fts-bm-calendar-legend {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Override plugin/core `.ui-datepicker { width: 17em }` — id wins over single class */
#fts-booking-modal .ui-datepicker {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-width: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/*
 * jQuery UI inline root: .ui-datepicker-inline.ui-datepicker.ui-widget…
 */
#fts-booking-modal #fts-bm-datepicker-inline.ui-datepicker-inline.ui-datepicker.ui-widget.ui-widget-content,
#fts-booking-modal #fts-bm-datepicker-inline.ui-datepicker-inline.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all,
#fts-booking-modal #fts-bm-datepicker-inline.ui-datepicker,
#fts-booking-modal #fts-bm-datepicker-inline.ui-datepicker.ui-widget-content,
#fts-booking-modal #fts-bm-datepicker-inline.ui-widget {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: block !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  align-self: stretch !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  outline: none !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif !important;
  font-size: 14px !important;
}

#fts-booking-modal #fts-bm-datepicker-inline table.ui-datepicker-calendar {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
}

#fts-booking-modal #fts-bm-datepicker-inline .ui-datepicker-header {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Month row — title center, light chevrons */
#fts-bm-datepicker-inline .ui-datepicker-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: transparent !important;
  border: none !important;
  padding: 0 2px 16px !important;
  margin: 0 !important;
}
#fts-bm-datepicker-inline .ui-datepicker-prev { order: 1 !important; }
#fts-bm-datepicker-inline .ui-datepicker-title {
  order: 2 !important;
  flex: 1 !important;
  text-align: center !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}
#fts-bm-datepicker-inline .ui-datepicker-next { order: 3 !important; }

#fts-bm-datepicker-inline .ui-datepicker-prev,
#fts-bm-datepicker-inline .ui-datepicker-next {
  position: static !important;
  width: 36px !important;
  height: 36px !important;
  top: auto !important;
  cursor: pointer !important;
  border: none !important;
  border-radius: 50% !important;
  background: transparent !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.15s ease !important;
}
#fts-bm-datepicker-inline .ui-datepicker-prev:hover,
#fts-bm-datepicker-inline .ui-datepicker-next:hover {
  background: rgba(148, 163, 184, 0.2) !important;
}

#fts-bm-datepicker-inline .ui-datepicker-prev .ui-icon,
#fts-bm-datepicker-inline .ui-datepicker-next .ui-icon {
  background-image: none !important;
  text-indent: 0 !important;
  font-size: 0 !important;
  width: auto !important;
  height: auto !important;
  position: static !important;
  margin: 0 !important;
  left: auto !important;
  top: auto !important;
}
#fts-bm-datepicker-inline .ui-datepicker-prev .ui-icon::after,
#fts-bm-datepicker-inline .ui-datepicker-next .ui-icon::after {
  content: '' !important;
  display: block !important;
  font-size: 22px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  color: #94a3b8 !important;
}
#fts-bm-datepicker-inline .ui-datepicker-prev .ui-icon::after { content: '\2039' !important; }
#fts-bm-datepicker-inline .ui-datepicker-next .ui-icon::after { content: '\203a' !important; }

/* Weekday row — MO TU … */
#fts-bm-datepicker-inline .ui-datepicker-calendar {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 4px !important;
  table-layout: fixed !important;
}
#fts-bm-datepicker-inline .ui-datepicker-calendar thead th {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  text-align: center !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  padding: 0 0 8px !important;
  border: none !important;
  background: transparent !important;
}

/* Day cells — circular hit targets */
#fts-bm-datepicker-inline .ui-datepicker-calendar td {
  padding: 2px 0 !important;
  border: none !important;
  text-align: center !important;
  vertical-align: middle !important;
  height: 40px !important;
  position: relative !important;
  background: transparent !important;
}

#fts-bm-datepicker-inline .ui-datepicker-calendar td a,
#fts-bm-datepicker-inline .ui-datepicker-calendar td span.ui-state-default {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  line-height: 1 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  background: transparent !important;
  border: none !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease !important;
}

#fts-bm-datepicker-inline .ui-datepicker-calendar td a:hover {
  background: rgba(148, 163, 184, 0.25) !important;
  color: #1e293b !important;
}

/* Selected — solid orange circle */
#fts-bm-datepicker-inline .ui-datepicker-calendar td a.ui-state-active {
  background: var(--v2-primary, #ff6b35) !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 14px rgba(255, 107, 53, 0.35) !important;
}

/* Today — subtle ring when not selected */
#fts-bm-datepicker-inline .ui-datepicker-calendar td a.ui-state-highlight:not(.ui-state-active) {
  background: transparent !important;
  color: #64748b !important;
  font-weight: 600 !important;
  box-shadow: inset 0 0 0 2px #cbd5e1 !important;
}

#fts-bm-datepicker-inline .ui-datepicker-calendar td a.ui-state-highlight.ui-state-active {
  background: var(--v2-primary, #ff6b35) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(255, 107, 53, 0.35) !important;
}

/* Disabled / muted */
#fts-bm-datepicker-inline .ui-datepicker-calendar td.ui-datepicker-unselectable span,
#fts-bm-datepicker-inline .ui-datepicker-calendar td.fts-v2-dp-disabled span {
  color: #cbd5e1 !important;
  opacity: 1 !important;
  font-weight: 500 !important;
  cursor: default !important;
}
#fts-bm-datepicker-inline .ui-datepicker-calendar td.ui-datepicker-other-month span {
  color: #cbd5e1 !important;
  opacity: 0.85 !important;
}

/* Best / Low price days (when not the selected day) */
#fts-bm-datepicker-inline td.fts-v2-dp-best a:not(.ui-state-active) {
  background: rgba(56, 161, 105, 0.14) !important;
  color: #047857 !important;
}
#fts-bm-datepicker-inline td.fts-v2-dp-low a:not(.ui-state-active) {
  background: rgba(229, 62, 62, 0.1) !important;
  color: #b91c1c !important;
}

/* Legend — line + dots */
.fts-bm-calendar-legend {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
  margin-top: 16px !important;
  padding-top: 14px !important;
  border-top: 1px solid #e2e8f0 !important;
}
.fts-bm-legend-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #64748b !important;
  margin: 0 !important;
}
.fts-bm-legend-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
}
.fts-bm-legend-low .fts-bm-legend-dot { background: #e53e3e !important; }
.fts-bm-legend-best .fts-bm-legend-dot { background: #38a169 !important; }

/* ══════════════════════════════════════════
   STEP 2: TRAVELERS
   ══════════════════════════════════════════ */
.fts-bm-travelers-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.fts-bm-traveler-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 8px 10px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  background: #fff !important;
  margin: 0 !important;
}
.fts-bm-traveler-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-traveler-label {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-traveler-meta {
  font-size: 10px !important;
  color: #94a3b8 !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-traveler-discount {
  display: inline-block !important;
  padding: 0 4px !important;
  border-radius: 3px !important;
  background: #dcfce7 !important;
  color: #16a34a !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  margin-left: 3px !important;
  line-height: 1.5 !important;
}
.fts-bm-counter {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.fts-bm-counter-btn {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 50% !important;
  border: 1.5px solid #e2e8f0 !important;
  background: #fff !important;
  color: #64748b !important;
  font-size: 16px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: border-color .15s, color .15s !important;
  padding: 0 !important;
  margin: 0 !important;
}
.fts-bm-counter-btn:hover:not(:disabled) { border-color: var(--v2-primary, #ff6b35) !important; color: var(--v2-primary, #ff6b35) !important; }
.fts-bm-counter-btn:disabled {
  opacity: .35 !important;
  cursor: not-allowed !important;
}
.fts-bm-counter-value {
  min-width: 18px !important;
  text-align: center !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ══════════════════════════════════════════
   STEP 3: PACKAGES
   ══════════════════════════════════════════ */
.fts-bm-pkg-info-bar {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 10px !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  color: #475569 !important;
  margin-bottom: 8px !important;
}
.fts-bm-pkg-info-bar span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-pkg-info-bar svg { flex-shrink: 0 !important; width: 12px !important; height: 12px !important; }

/* Package Cards */
.fts-bm-packages-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.fts-bm-package-card {
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  overflow: hidden !important;
  transition: border-color .15s, box-shadow .15s !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-package-card.selected {
  border-color: var(--v2-primary, #ff6b35) !important;
  box-shadow: 0 0 0 1.5px rgba(255,107,53,.1) !important;
}
.fts-bm-package-card:hover:not(.selected) { border-color: #94a3b8 !important; }

/* Badges */
.fts-bm-badge {
  text-align: center !important;
  padding: 3px 10px !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: .5px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}
.fts-bm-badge-popular { background: var(--v2-primary, #ff6b35) !important; color: #fff !important; }
.fts-bm-badge-value   { background: #16a34a !important; color: #fff !important; }

/* Package Inner */
.fts-bm-package-inner {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 10px 6px !important;
  margin: 0 !important;
}
.fts-bm-package-radio {
  flex-shrink: 0 !important;
  margin: 0 !important;
}
.fts-bm-package-radio input[type="radio"] {
  width: 16px !important;
  height: 16px !important;
  cursor: pointer !important;
  accent-color: var(--v2-primary, #ff6b35) !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-package-info {
  flex: 1 !important;
  min-width: 0 !important;
}
.fts-bm-package-name {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.3 !important;
  margin: 0 0 2px !important;
  padding: 0 !important;
}

/* Package Price */
.fts-bm-package-price {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 1px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
}
.fts-bm-price-old {
  font-size: 10px !important;
  color: #94a3b8 !important;
  text-decoration: line-through !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-price-save {
  display: inline-block !important;
  padding: 0 4px !important;
  border-radius: 3px !important;
  background: #dcfce7 !important;
  color: #16a34a !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}
.fts-bm-price-current {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #1e293b !important;
  line-height: 1.1 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-price-per {
  font-size: 10px !important;
  color: #94a3b8 !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* ══════════════════════════════════════════
   STEP 4: REVIEW & BOOK
   ══════════════════════════════════════════ */

/* Extra Services */
.fts-bm-extras-section {
  margin-bottom: 10px !important;
}
.fts-bm-extras-header {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  margin-bottom: 6px !important;
  padding: 0 !important;
}
.fts-bm-extras-header svg { width: 12px !important; height: 12px !important; }
.fts-bm-extras-opt {
  font-weight: 400 !important;
  color: #94a3b8 !important;
  font-size: 11px !important;
}

.fts-bm-extra-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 8px 10px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  margin-bottom: 5px !important;
  background: #fff !important;
}
.fts-bm-extra-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  min-width: 0 !important;
}
.fts-bm-extra-info strong {
  font-size: 12px !important;
  color: #1e293b !important;
  font-weight: 600 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-extra-price {
  font-size: 10px !important;
  color: #16a34a !important;
  font-weight: 500 !important;
}
.fts-bm-extra-counter {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.fts-bm-extra-counter .fts-bm-counter-btn {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  font-size: 14px !important;
}
.fts-bm-es-val {
  min-width: 16px !important;
  text-align: center !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
}

/* Price Breakdown Card */
.fts-bm-breakdown {
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  margin-bottom: 10px !important;
}
.fts-bm-breakdown-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
}
.fts-bm-breakdown-meta {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  margin-bottom: 6px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  font-size: 11px !important;
  color: #475569 !important;
}
.fts-bm-breakdown-meta .fts-bm-bd-line {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-breakdown-meta svg { width: 12px !important; height: 12px !important; }
.fts-bm-breakdown-lines {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  margin-bottom: 6px !important;
}
.fts-bm-bd-item {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 12px !important;
  color: #475569 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-bd-item-price {
  font-weight: 600 !important;
  color: #1e293b !important;
}
.fts-bm-breakdown-total {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding-top: 6px !important;
  border-top: 2px solid #1e293b !important;
}
.fts-bm-breakdown-total strong {
  font-size: 14px !important;
  color: #1e293b !important;
}
.fts-bm-total-amount {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #1e293b !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Submit Button */
.fts-bm-submit {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  padding: 11px 20px !important;
  border: none !important;
  border-radius: 10px !important;
  background: var(--v2-primary, #ff6b35) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .15s !important;
  margin-bottom: 8px !important;
  line-height: 1.3 !important;
}
.fts-bm-submit:hover { background: #e5622f !important; }
.fts-bm-submit:disabled {
  background: #cbd5e1 !important;
  cursor: not-allowed !important;
}
.fts-bm-submit svg { width: 14px !important; height: 14px !important; }
.fts-bm-submit-price {
  font-weight: 800 !important;
}

/* Spinner */
@keyframes ftsBmSpin {
  to { transform: rotate(360deg); }
}
.fts-bm-spinner {
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid rgba(255,255,255,.3) !important;
  border-top-color: #fff !important;
  border-radius: 50% !important;
  animation: ftsBmSpin .6s linear infinite !important;
  vertical-align: middle !important;
  margin-right: 4px !important;
}

/* Trust Footer */
.fts-bm-trust-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  font-size: 9px !important;
  color: #94a3b8 !important;
  padding: 2px 0 !important;
  margin: 0 !important;
}
.fts-bm-trust-footer span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.fts-bm-trust-footer svg { stroke: #94a3b8 !important; width: 10px !important; height: 10px !important; }
.fts-bm-footer-sep { color: #cbd5e1 !important; }

/* ─── STICKY FOOTER ─── */
.fts-bm-sticky-footer {
  display: none !important;
  padding: 8px 12px !important;
  background: #fff !important;
  border-top: 1px solid #e2e8f0 !important;
  box-shadow: 0 -2px 8px rgba(0,0,0,.05) !important;
}
.fts-bm-sticky-btn {
  margin-top: 0 !important;
}

/* ══════════════════════════════════════════
   COMPLETED STEP
   ══════════════════════════════════════════ */
.fts-bm-step.completed {
  border-color: #e2e8f0 !important;
  background: #fff !important;
}

/* ══════════════════════════════════════════
   DESKTOP ADJUSTMENTS
   ══════════════════════════════════════════ */
@media (min-width: 769px) {
  .fts-bm-overlay {
    align-items: center !important;
  }
  .fts-bm-container {
    max-width: 560px !important;
    border-radius: 16px !important;
    max-height: 90vh !important;
  }
  .fts-bm-sticky-footer {
    display: none !important;
  }
  .fts-bm-body {
    padding: 8px 16px 24px !important;
  }
  .fts-bm-step-body {
    padding: 0 14px 14px !important;
  }
}

/* ══════════════════════════════════════════
   MOBILE ADJUSTMENTS — full-screen booking sheet
   ══════════════════════════════════════════ */
@media (max-width: 768px) {
  #fts-booking-modal.fts-bm-overlay {
    align-items: stretch !important;
    justify-content: flex-start !important;
  }
  #fts-booking-modal .fts-bm-container {
    max-width: 100% !important;
    width: 100% !important;
    max-height: none !important;
    border-radius: 0 !important;
    flex: 1 1 auto !important;
    align-self: stretch !important;
    min-height: 100dvh !important;
    min-height: -webkit-fill-available !important;
    animation: ftsBmSlideUpFs .28s ease-out !important;
  }
  #fts-booking-modal .fts-bm-header {
    padding-top: calc(12px + env(safe-area-inset-top, 0px)) !important;
  }
  #fts-booking-modal .fts-bm-sticky-footer {
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .fts-bm-title { font-size: 12px !important; }
  .fts-bm-subtitle { font-size: 10px !important; }

  .fts-bm-sticky-footer {
    display: block !important;
  }

  .fts-bm-price-current { font-size: 16px !important; }
  .fts-bm-total-amount  { font-size: 18px !important; }

  #fts-booking-modal .fts-bm-body {
    min-height: 0 !important;
    padding-bottom: 70px !important;
  }

  .fts-bm-step-body { padding: 8px 10px !important; }
  .fts-bm-extras-section { margin-top: 6px !important; }
  .fts-bm-bd-card { padding: 8px 10px !important; }

  /* Prevent iOS/Android auto-zoom on input focus (requires >= 16px) */
  #fts-bm-date-input,
  .fts-bm-counter-value,
  .fts-bm-container input,
  .fts-bm-container select,
  .fts-bm-container textarea {
    font-size: 16px !important;
  }
}

/* ══════════════════════════════════════════
   TABS MODE — one step per screen, sticky Back + Continue
   ══════════════════════════════════════════ */
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-step:not(.active) {
  display: none !important;
}
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-step.active {
  display: block !important;
}
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-step-chevron,
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-step-edit {
  display: none !important;
}
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-step.active .fts-bm-step-head {
  cursor: default !important;
}
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-step .fts-bm-continue:not(.fts-bm-sticky-btn) {
  display: none !important;
}
#fts-booking-modal.fts-bm-tabs-mode #fts-bm-submit {
  display: none !important;
}
.fts-bm-sticky-row {
  display: flex !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
}
.fts-bm-sticky-row--no-back .fts-bm-sticky-back {
  display: none !important;
}
.fts-bm-sticky-row--no-back .fts-bm-sticky-btn {
  flex: 1 1 auto !important;
  width: 100% !important;
}
.fts-bm-sticky-back {
  flex: 0 0 auto !important;
  min-width: 88px !important;
  padding: 10px 14px !important;
  margin: 0 !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: #475569 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background .15s, border-color .15s !important;
  line-height: 1.3 !important;
}
.fts-bm-sticky-back:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
.fts-bm-sticky-back:disabled {
  opacity: 0.55 !important;
  cursor: not-allowed !important;
}
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-sticky-btn {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-sticky-footer {
  display: flex !important;
  flex-direction: column !important;
}
#fts-booking-modal.fts-bm-tabs-mode .fts-bm-body {
  padding-bottom: 76px !important;
}