/**
 * Landing /ve-xe - CSS bổ sung (đồng bộ giao diện /ve-may-bay).
 * Dùng chung bộ class lf-* (static-assets/css/style-common.css);
 * file này chỉ chứa phần riêng của vé xe, thay thế toàn bộ style inline trong landing_ve_xe.php.
 */

[x-cloak] { display: none !important; }

/* Hero: ảnh nền set qua data-bg (landing-vexe.js), fallback mặc định */
.lf-hero--vexe { background-image: url('/images/book-ve-2023-v4.jpg'); }

/* ═══ Khung tìm kiếm Vé Xe (.vmb-search-wrap & #ls-panel-vexe) ═══ */
.local-search-box:has(#ls-panel-vexe.active) { min-height: 0; }

/* Pax Trigger & Dropdown */
#vexePaxTrigger {
  position: relative !important;
  user-select: none;
}
#vexePaxTrigger.is-active i.fa-angle-down {
  transform: rotate(180deg);
}
#vexePaxDropdown {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 260px;
  max-width: 320px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.15);
  border: 1px solid #f0f0f0;
  z-index: 200;
  padding: 12px 16px;
  animation: lsDropdownFadeIn .18s ease;
}
#vexePaxDropdown.active {
  display: block;
}
@keyframes lsDropdownFadeIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
#vexePaxDropdown .ls-pax-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
}
#vexePaxDropdown .ls-pax-info strong {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #1f2937;
}
#vexePaxDropdown .ls-pax-info small {
  display: block;
  font-size: 12px;
  color: #6b7280;
  margin-top: 2px;
}
#vexePaxDropdown .ls-pax-ctrl {
  display: flex;
  align-items: center;
  gap: 10px;
}
#vexePaxDropdown .ls-pax-btn {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1.5px solid #e5e7eb;
  background: #fff;
  color: var(--c-primary, #ed007f);
  font-size: 16px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  line-height: 1;
  transition: all .15s ease;
}
#vexePaxDropdown .ls-pax-btn:hover:not(:disabled) {
  background: #fdf0f7;
  border-color: var(--c-primary, #ed007f);
  transform: scale(1.05);
}
#vexePaxDropdown .ls-pax-btn:disabled {
  border-color: #f3f4f6;
  color: #d1d5db;
  cursor: not-allowed;
  transform: none;
}
#vexePaxDropdown #vexePaxSeats {
  min-width: 22px;
  text-align: center;
  font-size: 15px;
  font-weight: 700;
  color: #111827;
}

/* Typeahead Dropdown cho Vé Xe */
#ls-panel-vexe .ls-typeahead-dd {
  max-height: 380px;
  overflow-y: auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);
  border: 1px solid #f0f0f0;
  z-index: 100;
  padding: 6px 0;
  scrollbar-width: thin;
  scrollbar-color: #e5e7eb transparent;
}
#ls-panel-vexe .ls-typeahead-dd::-webkit-scrollbar {
  width: 6px;
}
#ls-panel-vexe .ls-typeahead-dd::-webkit-scrollbar-thumb {
  background: #e5e7eb;
  border-radius: 3px;
}
#ls-panel-vexe .ls-typeahead-grp {
  padding: 8px 16px 4px;
  font-size: 11px;
  font-weight: 700;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: .5px;
  background: #f9fafb;
}
#ls-panel-vexe .ls-typeahead-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  cursor: pointer;
  transition: background .12s ease;
  border-bottom: 1px solid #f9fafb;
}
#ls-panel-vexe .ls-typeahead-item:last-child {
  border-bottom: none;
}
#ls-panel-vexe .ls-typeahead-item:hover,
#ls-panel-vexe .ls-typeahead-item.ls-hl {
  background: #fdf0f7;
}
#ls-panel-vexe .ls-typeahead-item.is-disabled {
  opacity: .45;
  cursor: not-allowed;
  background: #f9fafb;
}
#ls-panel-vexe .ls-typeahead-item-ic {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-primary, #ed007f);
}
#ls-panel-vexe .ls-typeahead-item-info {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
#ls-panel-vexe .ls-typeahead-item-name {
  font-size: 14px;
  font-weight: 600;
  color: #111827;
  margin-bottom: 2px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
#ls-panel-vexe .ls-typeahead-item-city {
  font-size: 12px;
  color: #6b7280;
}
#ls-panel-vexe .ls-typeahead-empty {
  padding: 20px 16px;
  text-align: center;
  color: #9ca3af;
  font-size: 13.5px;
}

/* Trường ngày về bị ẩn hoàn toàn ở chế độ Một chiều */
#ls-panel-vexe .ls-field-return-disabled {
  display: none !important;
}
#ls-panel-vexe .ls-field-return {
  animation: lsReturnFadeIn .2s ease;
}
@keyframes lsReturnFadeIn {
  from { opacity: 0; transform: scale(.98); }
  to   { opacity: 1; transform: scale(1); }
}

/* Mobile: Bottom-sheet cho chọn số chỗ (<768px) */
@media (max-width: 767px) {
  #ls-panel-vexe .ls-pax-dropdown.active {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    bottom: var(--ls-vv-bottom, 0px);
    top: auto;
    width: 100%;
    min-width: 0;
    max-width: none;
    max-height: 82vh;
    overflow-y: auto;
    margin: 0;
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -8px 30px rgba(0, 0, 0, .18);
    padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    z-index: 10060;
    animation: lsSheetUp .24s ease;
  }
  #ls-panel-vexe .ls-pax-dropdown.active::before {
    content: '';
    display: block;
    width: 42px;
    height: 4px;
    border-radius: 999px;
    background: #e2e4e8;
    margin: 0 auto 14px;
  }
  #ls-panel-vexe .ls-pax-dropdown.active .ls-pax-row {
    padding: 14px 4px;
  }
  #ls-panel-vexe .ls-fields > .ls-field .ls-typeahead-dd {
    min-width: 100% !important;
  }
}

/* Tuyến xe phổ biến - Tabs */
.lf-tabs {
  display: flex;
  gap: 4px;
  margin: 14px 0 18px;
  border-bottom: 2px solid #f0e0e8;
  overflow-x: auto;
  overflow-y: hidden;
  flex-wrap: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.lf-tabs::-webkit-scrollbar {
  display: none;
}
.lf-tab {
  background: none;
  border: none;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 600;
  color: #666;
  cursor: pointer;
  position: relative;
  transition: color .15s;
  border-radius: 8px 8px 0 0;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}
.lf-tab:hover { color: #ed007f; background: #fdf0f7; }
.lf-tab.active { color: #ed007f; }
.lf-tab.active::after { content: ''; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: #ed007f; border-radius: 2px; }
.vexe-lf-section .lf-tab i { margin-right: 4px; }

@media (max-width: 767px) {
  .lf-tabs {
    gap: 6px;
    margin-left: -16px;
    margin-right: -16px;
    padding-left: 16px;
    padding-right: 16px;
    margin-top: 10px;
    margin-bottom: 16px;
  }
  .lf-tab {
    padding: 8px 14px;
    font-size: 13.5px;
  }
}
.lf-route-thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.lf-route-img .lf-route-label,
.lf-route-img .lf-route-img-text { z-index: 1; }
.lf-route-route i,
.lf-route-date i { color: var(--c-primary, #ed007f); margin-right: 4px; }
.lf-route-card[href="javascript:void(0)"] { cursor: pointer; }

/* USP: icon FontAwesome thay emoji */
.lf-usp-icon i { color: var(--c-primary, #ed007f); font-size: 28px; }

/* Intro CMS */
.vexe-intro-content { color: #475569; line-height: 1.75; font-size: 14.5px; }
.vexe-intro-more { text-align: center; margin-top: 16px; }
.vexe-intro-more .fa { font-size: 12px; margin-left: 4px; }
.vexe-hidden { display: none; }

/* Công cụ tiện ích */
.vexe-tool-icon i { color: var(--c-primary, #ed007f); font-size: 24px; }

/* Tin tức: ảnh phủ kín khung */
.lf-news-img { position: relative; overflow: hidden; }

/* ═══ RESPONSIVE SEARCH FORM: Desktop / Mobile Switch ═══ */
@media (min-width: 768px) {
  .vexe-mobile-form {
    display: none !important;
  }
  .vexe-desktop-form {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .vexe-desktop-form {
    display: none !important;
  }
  .vexe-mobile-form {
    display: block !important;
    width: 100%;
  }
  /* Đồng bộ căn chỉnh đệm & cỡ chữ cho form mobile vé xe giống hệt #vmbForm */
  #vexeFormMobile {
    padding: 12px 14px 14px;
    gap: 10px;
  }
  #vexeFormMobile .vmb-trip {
    padding: 3px;
  }
  #vexeFormMobile .vmb-trip-pill {
    padding: 7px 16px;
    line-height: 20px;
  }
  #vexeFormMobile .vmb-od {
    padding-top: 8px;
    padding-bottom: 8px;
    gap: 0;
  }
  #vexeFormMobile .vmb-od-lbl {
    line-height: 16px;
  }
  #vexeFormMobile .vmb-od-code {
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #vexeFormMobile .vmb-od-city {
    font-size: 12px;
    line-height: 16px;
  }
  #vexeFormMobile .vmb-swap {
    width: 36px;
    height: 36px;
  }
  #vexeFormMobile .vmb-dates,
  #vexeFormMobile .vmb-pc-row {
    gap: 10px;
  }
  #vexeFormMobile .vmb-field {
    padding-top: 7px;
    padding-bottom: 8px;
    gap: 1px;
    margin-bottom: 0;
  }
  #vexeFormMobile .vmb-field-lbl {
    line-height: 16px;
  }
  #vexeFormMobile .vmb-field-val,
  #vexeFormMobile .vmb-date-disp {
    line-height: 20px;
  }
  #vexeFormMobile .vmb-submit {
    padding: 13px;
  }
}

/* ═══ MODAL TOÀN MÀN HÌNH CHỌN ĐỊA ĐIỂM MOBILE (ĐỒNG BỘ 100% VÉ MÁY BAY) ═══ */
.hdp-modal.vexe-apfs-modal {
  position: fixed;
  inset: 0;
  z-index: 100080;
  background: #fff;
  display: flex;
  flex-direction: column;
  height: var(--hdp-vh, 100dvh);
  max-height: 100dvh;
}
.vexe-apfs-modal .hdp-m-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid #f1f3f4;
}
.vexe-apfs-modal .hdp-m-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #f3f4f6;
  color: #374151;
  cursor: pointer;
  transition: background .15s;
}
.vexe-apfs-modal .hdp-m-close:active {
  background: #e5e7eb;
}
.vexe-apfs-modal .hdp-m-title {
  font-size: 17px;
  font-weight: 700;
  color: #111827;
}
.vexe-apfs-modal .hdp-m-searchwrap {
  flex: 0 0 auto;
  position: relative;
  padding: 12px 16px;
}
.vexe-apfs-modal .hdp-m-search {
  width: 100%;
  height: 46px;
  padding: 0 42px 0 14px;
  border: 2px solid var(--c-primary, #ed007f);
  border-radius: 12px;
  font-size: 16px;
  font-family: inherit;
  color: #1f2937;
  outline: none;
  background: #fff;
}
.vexe-apfs-modal .hdp-m-clear {
  position: absolute;
  right: 26px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 0;
  background: transparent;
  color: #9ca3af;
  cursor: pointer;
}
.vexe-apfs-modal .hdp-m-list {
  flex: 1 1 auto;
  max-height: none;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}
.vexe-apfs-modal .vmb-ap-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid #f9fafb;
  cursor: pointer;
  transition: background .12s;
}
.vexe-apfs-modal .vmb-ap-item:active,
.vexe-apfs-modal .vmb-ap-item:hover {
  background: #fdf0f7;
}
.vexe-apfs-modal .vmb-ap-code {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #fdf0f7;
  color: var(--c-primary, #ed007f);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  flex: 0 0 36px;
}
.vexe-apfs-modal .vmb-ap-city {
  font-size: 15px;
  font-weight: 700;
  color: #111827;
}
.vexe-apfs-modal .vmb-ap-name {
  font-size: 12.5px;
  color: #6b7280;
}
.vexe-apfs-modal .vmb-ap-group {
  padding: 10px 14px 4px;
  font-size: 12px;
  font-weight: 700;
  color: #9ca3af;
  text-transform: uppercase;
  background: #f9fafb;
}
.vexe-apfs-modal .vmb-ap-item.is-disabled {
  opacity: .45;
  cursor: not-allowed;
  background: #f9fafb;
}
body.hdp-lock {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  overflow: hidden;
}

/* ═══ ĐỒNG BỘ POPUP LỊCH MOBILE .vmb-cal (100% KHỚP VÉ MÁY BAY, FIX XUNG ĐỘT TỪ STYLE.MIN.CSS) ═══ */
.vmb-cal-mo {
  margin-bottom: 12px;
}
.vmb-cal-mo-lbl {
  font-size: 15px;
  font-weight: 800;
  color: #1a1a1a;
  padding: 12px 4px 6px;
}
.vmb-cal-grid {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  gap: 0 !important;
  width: 100% !important;
}
.vmb-cal-d {
  position: relative !important;
  z-index: 0 !important;
  height: 46px !important;
  border: 0 !important;
  background: transparent;
  font: inherit !important;
  font-size: 14.5px !important;
  color: #1f2937;
  cursor: pointer !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  grid-column: auto !important;
  box-sizing: border-box !important;
  flex-direction: column !important;
  line-height: 1.1 !important;
}
.vmb-cal-d.empty {
  visibility: hidden !important;
  pointer-events: none !important;
  grid-column: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 46px !important;
  width: auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.vmb-cal-d.past {
  color: #d2d2d2 !important;
  cursor: default !important;
}
.vmb-cal-d.today {
  font-weight: 800 !important;
}
/* Dải nối range khứ hồi (light pink) */
.vmb-cal-d.inrange {
  background: #fdeef7 !important;
}
.vmb-cal-d.start::before,
.vmb-cal-d.end::before {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 50% !important;
  height: 40px !important;
  background: #fdeef7 !important;
  z-index: -2 !important;
}
.vmb-cal-d.start::before { right: 0 !important; }
.vmb-cal-d.end::before { left: 0 !important; }
.vmb-cal-d.start.end::before { display: none !important; }

/* Nút tròn màu hồng thương hiệu #ed007f (ngày chọn / đầu-cuối range) */
.vmb-cal-d.sel::after,
.vmb-cal-d.start::after,
.vmb-cal-d.end::after,
.vmb-cal-d.today::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  z-index: -1 !important;
}
.vmb-cal-d.sel::after,
.vmb-cal-d.start::after,
.vmb-cal-d.end::after {
  background: #ed007f !important;
}
.vmb-cal-d.today::after {
  box-shadow: inset 0 0 0 1.6px #ed007f !important;
}
/* Thứ 7 màu xanh dương (#2563eb), CN và ngày lễ màu đỏ (#e53935) với nền hồng nhạt (#fdeef0) (chỉ khi CHƯA chọn) */
.vmb-cal-wk .sat,
.vmb-cal-d[data-k="sat"]:not(.past):not(.start):not(.end):not(.sel) {
  color: #2563eb !important;
}
.vmb-cal-wk .sun,
.vmb-cal-d:is([data-k="sun"], [data-k="hol"]):not(.past):not(.start):not(.end):not(.sel) {
  color: #e53935 !important;
}
.vmb-cal-d:is([data-k="sun"], [data-k="hol"]):not(.past):not(.start):not(.end):not(.sel) .vmb-cal-l {
  color: #e57373 !important;
}
.vmb-cal-d:is([data-k="sun"], [data-k="hol"]):not(.past):not(.inrange):not(.start):not(.end):not(.sel) {
  padding: 2px !important;
  border-radius: 11px !important;
  background: #fdeef0 !important;
  background-clip: content-box !important;
}

/* Khi ngày được chọn (start, end, sel) - KỂ CẢ THỨ 7, CHỦ NHẬT, NGÀY LỄ: Chữ BẮT BUỘC MÀU TRẮNG */
.vmb-cal-d.sel,
.vmb-cal-d.start,
.vmb-cal-d.end,
.vmb-cal-d.sel:not(.past),
.vmb-cal-d.start:not(.past),
.vmb-cal-d.end:not(.past),
.vmb-cal-d:is(.sel, .start, .end),
.vmb-cal-d:is(.sel, .start, .end)[data-k],
.vmb-cal-d:is(.sel, .start, .end) .vmb-cal-n {
  color: #fff !important;
  font-weight: 700 !important;
}
.vmb-cal-d:is(.sel, .start, .end) .vmb-cal-l {
  color: #fff !important;
  opacity: .92 !important;
}

/* Tiêu đề phụ, footer và các nút hành động */
.vmb-cal-sub {
  font-size: 12.5px !important;
  color: #ed007f !important;
  font-weight: 600 !important;
}
.vmb-cal-ft {
  display: flex !important;
  gap: 10px !important;
  padding: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  border-top: 1px solid #f0f0f0 !important;
  flex: 0 0 auto !important;
}
.vmb-cal-clear {
  flex: 0 0 auto !important;
  padding: 13px 20px !important;
  border: 1px solid #e0e0e0 !important;
  background: #fff !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  color: #666 !important;
  font: inherit !important;
  cursor: pointer !important;
}
.vmb-cal-ok {
  flex: 1 !important;
  padding: 13px !important;
  border: 0 !important;
  background: #ed007f !important;
  color: #fff !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  cursor: pointer !important;
}

/* ═══ ĐỒNG BỘ 100% #sfEditPanel TÌM KIẾM VÉ XE VỚI VÉ MÁY BAY TRÊN MOBILE ═══ */
.vexe-mobile-sticky-bar {
  display: none !important;
}

@media (min-width: 768px) {
  .sf-edit-compact .sf-cmp-body,
  .sf-edit-compact .sf-cmp-meta,
  .sf-edit-compact .sf-cmp-pt {
    display: contents !important;
  }
}

@media (max-width: 767px) {
  /* Ép hiển thị panel và header tìm kiếm trên mobile, ghi đè triệt để style.min.css */
  .sf-edit-panel,
  body.dlv-page-ve-xe .sf-edit-panel {
    display: block !important;
    position: sticky !important;
    top: 50px !important;
    z-index: 60 !important;
    padding: 7px 10px !important;
    background: #fff !important;
    border: none !important;
    margin: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .sf-header,
  body.dlv-page-ve-xe .sf-header {
    display: none !important;
  }
  .sf-summary-bar,
  body.dlv-page-ve-xe .sf-summary-bar {
    display: none !important;
  }

  /* Thẻ tóm tắt hành trình gọn gàng trên mobile (.sf-edit-compact) */
  .sf-edit-panel .sf-edit-compact,
  body.dlv-page-ve-xe .sf-edit-compact {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 8px !important;
    border: 1px solid #eceef1 !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.05) !important;
    font-size: 12px !important;
    color: #5f6368 !important;
    background: #fff !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }
  .sf-edit-panel .sf-edit-compact:active {
    background: #fdf7fa !important;
  }
  .sf-edit-panel .sf-cmp-num {
    display: none !important;
  }
  .sf-edit-panel .sf-cmp-ic {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    background: #fdeef7 !important;
    color: var(--c-primary, #ed007f) !important;
    font-size: 15px !important;
  }
  .sf-edit-panel .sf-cmp-body {
    display: flex !important;
    flex-direction: column !important;
    gap: 1px !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  /* Vạch "|" giữa chặng và ngày chỉ dùng cho 1 dòng trên desktop; mobile xếp 2 dòng nên ẩn */
  .sf-edit-panel .sf-cmp-body > .sf-cmp-sep {
    display: none !important;
  }
  .sf-edit-panel .sf-cmp-route {
    display: flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    min-width: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    color: #1a1a1a !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .sf-edit-panel .sf-cmp-route b {
    color: #1a1a1a !important;
    font-weight: 700 !important;
  }
  .sf-edit-panel .sf-cmp-arrow {
    color: var(--c-primary, #ed007f) !important;
    font-weight: 700 !important;
    margin: 0 2px !important;
  }
  .sf-edit-panel .sf-cmp-meta {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-width: 0 !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
    font-size: 12px !important;
    color: #5f6368 !important;
  }
  .sf-edit-panel .sf-cmp-date {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .sf-edit-panel .sf-cmp-sep {
    color: #d0d0d0 !important;
  }
  .sf-edit-panel .sf-cmp-pax {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex: 0 0 auto !important;
  }
  .sf-edit-panel .sf-cmp-edit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #fdeef7 !important;
    color: var(--c-primary, #ed007f) !important;
    flex-shrink: 0 !important;
  }

  /* Form mặc định ẩn trên mobile (chỉ hiện compact info-bar) */
  .sf-edit-panel:not(.mob-exp) .sf-edit-form {
    display: none !important;
  }
  .sf-edit-panel:not(.mob-exp) .sf-mob-sheet-hdr {
    display: none !important;
  }

  /* Backdrop khi mở modal bottom-sheet */
  .sf-edit-backdrop {
    display: none;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(17,24,39,.5) !important;
    z-index: 100080 !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
  }
  .sf-edit-backdrop.mob-open {
    display: block !important;
  }

  /* Bottom sheet khi mở (.mob-exp) giống 100% Vé Máy Bay */
  .sf-edit-panel.mob-exp,
  body.dlv-page-ve-xe .sf-edit-panel.mob-exp {
    position: fixed !important;
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    max-height: 88vh !important;
    max-height: 88dvh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    border-radius: 20px 20px 0 0 !important;
    z-index: 100085 !important;
    background: #fff !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: 0 -8px 30px rgba(0,0,0,.2) !important;
    animation: sfSheetUp .26s ease-out !important;
    display: flex !important;
    flex-direction: column !important;
  }
  @keyframes sfSheetUp {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
  }

  .sf-edit-panel.mob-exp .sf-edit-compact {
    display: none !important;
  }

  .sf-edit-panel.mob-exp .sf-mob-sheet-hdr {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    flex-direction: column !important;
    padding: 10px 16px 0 !important;
    background: #fff !important;
    border-bottom: 1px solid #f0f0f0 !important;
    flex-shrink: 0 !important;
  }
  .sf-edit-panel.mob-exp .sf-mob-drag {
    width: 40px !important;
    height: 4px !important;
    background: #e0e0e0 !important;
    border-radius: 2px !important;
    margin-bottom: 10px !important;
  }
  .sf-edit-panel.mob-exp .sf-mob-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #222 !important;
    padding-bottom: 10px !important;
    width: 100% !important;
    text-align: center !important;
    border: none !important;
  }
  .sf-edit-panel.mob-exp .sf-mob-close {
    position: absolute !important;
    top: 10px !important;
    right: 14px !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    color: #888 !important;
    padding: 4px !important;
    line-height: 0 !important;
  }

  .sf-edit-panel.mob-exp .sf-edit-form {
    display: block !important;
    padding: 12px 14px calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    box-shadow: none !important;
    border: none !important;
    background: #fff !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    margin: 0 !important;
  }

  /* Form bên trong bottom sheet */
  .sf-edit-panel.mob-exp .vmb-card {
    box-shadow: none !important;
    border: none !important;
    padding: 4px 0 0 !important;
    gap: 12px !important;
  }
  .sf-edit-panel.mob-exp .vmb-btn {
    margin-top: 4px !important;
  }
}

/* Đảm bảo thứ tự tầng hiển thị (z-index) khi mở các popup con từ sheet */
.vmb-cal-bd {
  z-index: 100090 !important;
}
.vmb-cal {
  z-index: 100095 !important;
}
.vexe-apfs-modal {
  z-index: 100100 !important;
}

/* ═══ MODAL CHỌN SỐ CHỖ MOBILE (#vexeMobilePaxPop) ═══
   Nổi lên trên toàn bộ phần tử, bao gồm cả 2 bong bóng chat (Zalo & AI Bot / Subiz)
   để không bị che khuất nút tăng/giảm (+) (-) và số chỗ */

@keyframes vmbSheetUp2 {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

@media (max-width: 767px) {
  /* Nâng stacking context cho wrapper form tìm kiếm khi mở popup chọn số chỗ */
  .lf-search-overlay:has(#vexeMobilePaxPop:not([hidden])),
  .sf-edit-form:has(#vexeMobilePaxPop:not([hidden])),
  .sf-edit-panel:has(#vexeMobilePaxPop:not([hidden])),
  .vexe-mobile-form:has(#vexeMobilePaxPop:not([hidden])),
  body.vexe-pax-open .lf-search-overlay,
  body.vexe-pax-open .sf-edit-form,
  body.vexe-pax-open .sf-edit-panel,
  body.vexe-pax-open .vexe-mobile-form,
  body.vmb-sheet-open .lf-search-overlay,
  body.vmb-sheet-open .sf-edit-form,
  body.vmb-sheet-open .sf-edit-panel,
  body.vmb-sheet-open .vexe-mobile-form {
    z-index: 2147483646 !important;
  }

  /* Backdrop mờ phía sau modal chọn số chỗ mobile */
  .vexe-pax-backdrop {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, .45) !important;
    z-index: 2147483646 !important;
  }
  .vexe-pax-backdrop[hidden] {
    display: none !important;
  }

  /* Sheet chọn số chỗ mobile (#vexeMobilePaxPop) dạng bottom-sheet đồng bộ vé máy bay */
  #vexeMobilePaxPop:not([hidden]) {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    bottom: var(--vmb-vv-bottom, 0px) !important;
    top: auto !important;
    width: 100% !important;
    max-width: none !important;
    max-height: 82vh !important;
    overflow-y: auto !important;
    margin: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    box-shadow: 0 -8px 30px rgba(0, 0, 0, .2) !important;
    padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px)) !important;
    z-index: 2147483647 !important;
    background: #fff !important;
    animation: vmbSheetUp2 .24s ease !important;
  }

  #vexeMobilePaxPop:not([hidden])::before {
    content: '';
    display: block;
    width: 42px;
    height: 4px;
    border-radius: 999px;
    background: #e2e4e8;
    margin: 0 auto 14px;
  }

  #vexeMobilePaxPop .vmb-pax-row {
    padding: 10px 0 !important;
  }

  #vexeMobilePaxPop .vmb-pax-done {
    margin-top: 14px !important;
    width: 100% !important;
    background: var(--c-primary, #ed007f) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 12px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
  }
}

/* Ẩn triệt để 2 bong bóng chat (Zalo, AI Chatbot) và các widget nổi khi mở modal chọn số chỗ */
body.vexe-pax-open #vnt-zalo-fab,
body.vexe-pax-open .dlv-bot-fab,
body.vexe-pax-open #wpwidget,
body.vexe-pax-open .zalo-chat-widget,
body.vexe-pax-open .box-search-group,
body.vexe-pax-open #subiz-button-container,
body.vexe-pax-open .subiz-widget-container,
body.vexe-pax-open .ai-chatbot-launcher,
body.vexe-pax-open #aiChatbotLauncher,
body.vexe-pax-open iframe[src*="subiz"],
body.vexe-pax-open iframe[src*="zalo"],
body:has(#vexeMobilePaxPop:not([hidden])) #vnt-zalo-fab,
body:has(#vexeMobilePaxPop:not([hidden])) .dlv-bot-fab,
body:has(#vexeMobilePaxPop:not([hidden])) #wpwidget,
body:has(#vexeMobilePaxPop:not([hidden])) .zalo-chat-widget,
body:has(#vexeMobilePaxPop:not([hidden])) .box-search-group,
body:has(#vexeMobilePaxPop:not([hidden])) #subiz-button-container,
body:has(#vexeMobilePaxPop:not([hidden])) .subiz-widget-container,
body:has(#vexeMobilePaxPop:not([hidden])) .ai-chatbot-launcher,
body:has(#vexeMobilePaxPop:not([hidden])) #aiChatbotLauncher,
body:has(#vexeMobilePaxPop:not([hidden])) iframe[src*="subiz"],
body:has(#vexeMobilePaxPop:not([hidden])) iframe[src*="zalo"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
  z-index: -1 !important;
}

/* ═══ Bộ lọc Khung giờ: Giờ đi & Giờ đến (Đồng bộ vé máy bay) ═══ */
.ve-tham-quan-theme .sf-time-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.ve-tham-quan-theme .sf-time-col-head {
  font-size: 12px;
  font-weight: 600;
  color: var(--c-primary, #ed007f);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px dashed #eee;
}
.ve-tham-quan-theme .sf-time-cols .sf-filter-group {
  gap: 8px;
}
.ve-tham-quan-theme .sf-time-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
}
.ve-tham-quan-theme .sf-time-item input[type="checkbox"] {
  margin-top: 2px;
  flex-shrink: 0;
}
.ve-tham-quan-theme .sf-time-item .sf-time-body {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.ve-tham-quan-theme .sf-time-item .sf-time-name {
  font-size: 13px;
  font-weight: 400;
  color: #000;
  line-height: 1.25;
}
.ve-tham-quan-theme .sf-time-item .sf-time-range {
  font-size: 11px;
  color: #888;
  font-weight: 400;
  line-height: 1.25;
}