body{
}
    /*----------main color------------*/
    .text-blue-1,
    .header .header-menu .menu .subnav > li > a:hover,
    .bc_wrap .footer .menu-footer .menu__nav li .subnav > li > a:hover,
    .desktopMenu .menu a:hover,
    .desktopMenu .menu .subnav__backBtn a,
    .hotel_rooms_form .nav-enquiry .enquiry-item.active span,
    .bc_single_book .nav-enquiry .enquiry-item.active span,
    .pricing-table .title{
    color: #3554D1;
    }

    .tabs.-underline .tabs__controls .tabs__button:hover,
    .tabs.-pills-2 .tabs__controls .tabs__button:hover,
    .tabs.-bookmark-2 .tabs__button:hover,
    .sidebar.-dashboard .sidebar__button.-is-active,
    .tabs.-underline-2 .tabs__controls .tabs__button.is-tab-el-active,
    .accordion.-db-sidebar .accordion__item.is-active .sidebar__button,
    .tabs.-underline-2 .tabs__controls .tabs__button:hover{
    color: #3554D1 !important;
    }

    .pagination.-dots .pagination__item.is-active,
    .button.-outline-blue-1:hover,
    .form-checkbox:hover input ~ .form-checkbox__mark,
    .pricing-tabs .tab-btns:before,
    .tabs.-underline-2 .tabs__controls .tabs__button::after{
    background-color: #3554D1;
    }

    .bg-blue-1,
    .button.-blue-1:hover,
    .tabs.-pills-2 .tabs__controls .tabs__button.is-tab-el-active,
    .tourTypeCard.-type-1:hover,
    .noUi-connect,
    .accordion.-map .accordion__item.is-active .accordion__icon,
    .form-checkbox input:checked ~ .form-checkbox__mark{
    background-color: #3554D1 !important;
    }

    .button.-blue-1:hover,
    .border-blue-1,
    .button.-outline-blue-1,
    .noUi-handle,
    .hotel_rooms_form .nav-enquiry .enquiry-item.active span,
    .bc_single_book .nav-enquiry .enquiry-item.active span,
    .form-checkbox input:checked ~ .form-checkbox__mark,
    .pricing-table .inner-box:hover, .pricing-table.tagged .inner-box{
    border-color: #3554D1;
    }
    /*-----------end main color------------*/





/*---- Trang chủ: viết hoa tiêu đề từng section ----*/
.page-template-content .sectionTitle__title,
.page-template-content section > .container h2,
.page-template-content .form-search-all-service h1{
    text-transform: uppercase;
}

/*---- Điểm đến nổi bật: card overlay đều, bo góc nhẹ ----*/
.dest-grid .citiesCard.-type-3{
    aspect-ratio: 4 / 3;
}
.dest-grid .citiesCard.-type-3 .citiesCard__content{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    text-align: center;
}
.dest-grid .citiesCard.-type-3 .citiesCard__content::before{
    background: linear-gradient(180deg, rgba(5,16,54,0) 35%, rgba(5,16,54,.65) 100%);
}
.dest-grid .citiesCard.-type-3 .citiesCard__content h4{
    text-transform: uppercase;
}

/*---- Nhật ký hành trình: collage lưới đều (1 ảnh trung tâm to), accent = bóng đổ lệch xanh dương ----*/
.travel-journal .tj-collage{
    position: relative;
    max-width: 1240px;
    margin: 0 auto;
    padding: 60px 96px 72px;   /* chừa lề cho dấu ngoặc to, không đè ảnh */
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: repeat(3, 168px);
    gap: 24px;                 /* khoảng cách đều giữa các ảnh */
}
.travel-journal .tj-item{
    margin: 0;
    border-radius: 4px;
    transition: transform .3s ease;
    box-shadow: 0 10px 24px rgba(5,16,54,.10);
}
.travel-journal .tj-item img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
}
.travel-journal .tj-item:hover{ transform: translateY(-4px); }

/* Nút "Xem thêm" trong Nhật ký hành trình: fix hover bị nền xanh chữ xanh */
.travel-journal .button.bg-blue-1{ transition: all .3s ease; border-radius: 4px; }
.travel-journal .button.bg-blue-1:hover{
    background-color: var(--color-dark-1, #051036) !important;
    color: #fff !important;
}
.travel-journal .button.bg-blue-1:hover i{ color: #fff !important; }

/* Xếp đều thành 3 hàng, ảnh #5 ở giữa to (rộng + cao gấp đôi), không ảnh nào chồng nhau */
.travel-journal .tj-item:nth-child(1){  grid-column: 1 / 4;   grid-row: 1; }
.travel-journal .tj-item:nth-child(2){  grid-column: 4 / 7;   grid-row: 1; }
.travel-journal .tj-item:nth-child(3){  grid-column: 7 / 10;  grid-row: 1; }
.travel-journal .tj-item:nth-child(4){  grid-column: 10 / 13; grid-row: 1; }
.travel-journal .tj-item:nth-child(5){  grid-column: 5 / 9;   grid-row: 2 / 4; }   /* TRUNG TÂM to */
.travel-journal .tj-item:nth-child(6){  grid-column: 1 / 3;   grid-row: 2; }
.travel-journal .tj-item:nth-child(7){  grid-column: 3 / 5;   grid-row: 2; }
.travel-journal .tj-item:nth-child(8){  grid-column: 9 / 11;  grid-row: 2; }
.travel-journal .tj-item:nth-child(9){  grid-column: 11 / 13; grid-row: 2; }
.travel-journal .tj-item:nth-child(10){ grid-column: 1 / 3;   grid-row: 3; }
.travel-journal .tj-item:nth-child(11){ grid-column: 3 / 5;   grid-row: 3; }
.travel-journal .tj-item:nth-child(12){ grid-column: 9 / 13;  grid-row: 3; }
/* dư ảnh (>12): ẩn ở desktop để giữ bố cục cân đối */
.travel-journal .tj-item:nth-child(n+13){ display: none; }

/* accent = BÓNG ĐỔ LỆCH màu xanh dương (không phải viền); hướng bóng hất ra theo
   vị trí của ảnh trong collage — góc nào thì chếch ra góc đó (tỏa từ tâm) */
.travel-journal .tj-item:nth-child(1){  box-shadow: -16px -16px 0 0 var(--color-blue-1); }  /* trên-trái */
.travel-journal .tj-item:nth-child(4){  box-shadow:  16px -16px 0 0 var(--color-blue-1); }  /* trên-phải */
.travel-journal .tj-item:nth-child(10){ box-shadow: -16px  16px 0 0 var(--color-blue-1); }  /* dưới-trái */
.travel-journal .tj-item:nth-child(12){ box-shadow:  16px  16px 0 0 var(--color-blue-1); }  /* dưới-phải */

/* dấu nháy trang trí màu xanh dương — to, sát ảnh góc trên-trái & dưới-phải, không đè ảnh */
.travel-journal .tj-quote{
    position: absolute;
    font-family: Georgia, serif;
    font-size: 130px;
    line-height: 1;
    color: var(--color-blue-1);
    font-weight: 700;
    z-index: 2;
}
.travel-journal .tj-quote--start{ top: -14px;     left: 6px; }
.travel-journal .tj-quote--end{   bottom: -48px;  right: 8px; }

/* Tablet */
@media (max-width: 1199px){
    .travel-journal .tj-collage{ grid-template-rows: repeat(3, 140px); gap: 18px; padding: 24px 16px 32px; }
}
/* Mobile: bỏ collage lệch + bóng xanh (rối trên mobile) → gallery gọn 2 cột đều,
   tỉ lệ 4:3, bo góc nhẹ, chỉ hiện 6 ảnh (3 hàng) cho gọn */
@media (max-width: 767px){
    .travel-journal{ padding-top: 42px !important; padding-bottom: 42px !important; }
    .travel-journal .tj-collage{
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: none;
        grid-auto-rows: auto;
        gap: 12px;
        padding: 6px 0 2px;
    }
    /* reset MỌI item về ô đều nhau (kể cả ô trung tâm #5 và các ô có bóng xanh) */
    .travel-journal .tj-item,
    .travel-journal .tj-item:nth-child(1),
    .travel-journal .tj-item:nth-child(4),
    .travel-journal .tj-item:nth-child(5),
    .travel-journal .tj-item:nth-child(10),
    .travel-journal .tj-item:nth-child(12){
        grid-column: auto !important;
        grid-row: auto !important;
        aspect-ratio: 4 / 3;
        border-radius: 8px;
        box-shadow: 0 6px 16px rgba(5,16,54,.10) !important;   /* bỏ bóng xanh lệch */
    }
    .travel-journal .tj-item img{ border-radius: 8px; }
    .travel-journal .tj-item:nth-child(n+7){ display: none !important; }  /* chỉ 6 ảnh */
    .travel-journal .tj-quote{ display: none; }
    .travel-journal .button.-md{ width: 100%; justify-content: center; }
}

/*---- Trang liên hệ: thêm màu thương hiệu, bớt nền trắng trống ----*/
/* Form: dải accent xanh dương trên đỉnh thẻ + tiêu đề theo màu chủ đạo */
.bc-contact-block .map-form{
    border-top: 4px solid #3554D1;
}
.bc-contact-block .map-form .text-22{
    color: #3554D1;
}
.bc-contact-block .map-form .button.-dark-1{
    background-color: #3554D1 !important;
}

/* Khối thông tin liên hệ: nền trắng */
.bc-contact-block section.layout-pt-md{
    background: #fff !important;
    padding-top: 56px;
    padding-bottom: 56px;
}
/* Tiêu đề "Liên hệ" gạch chân màu thương hiệu */
.bc-contact-block section.layout-pt-md .text-30{
    color: #051036;
    position: relative;
    padding-bottom: 14px;
}
.bc-contact-block section.layout-pt-md .text-30::after{
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 56px; height: 3px;
    background: #3554D1;
    border-radius: 2px;
}
/* Nhãn (Địa chỉ, Hotline...) đậm theo màu thương hiệu, giá trị đậm rõ */
.bc-contact-block section.layout-pt-md .text-14.text-light-1{
    color: #3554D1 !important;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 600;
}
.bc-contact-block section.layout-pt-md .text-18{
    color: #051036;
}
.bc-contact-block section.layout-pt-md a i{
    color: #3554D1;
}

/* Desktop: bản đồ cao hơn để lấp khoảng trắng; form hạ thấp lấn chồng section dưới */
@media (min-width: 992px){
    /* Khung bản đồ: bỏ tỉ lệ 16:9 (vốn cao ~855px > iframe → hở trắng đáy), ép cao cố định
       820px và cho iframe phủ kín khung */
    .bc-contact-block > .ratio{
        height: 820px;
    }
    .bc-contact-block > .ratio::before{
        display: none;
    }
    .bc-contact-block .map-ratio,
    .bc-contact-block .iframe_map{
        height: 100% !important;
    }
    /* iframe phải set chiều cao THẲNG = khung (height:100% không xuyên xuống iframe) */
    .bc-contact-block .iframe_map iframe{
        height: 820px !important;
    }
    /* Section chứa form ĐƯA RA KHỎI LUỒNG (absolute) → band xanh BUỘC dính ngay đáy bản đồ,
       không còn "phần dư" gây khúc trắng. Form nổi đè lên bản đồ. */
    .bc-contact-block{
        position: relative;
    }
    .bc-contact-block > section:first-of-type{
        position: absolute;
        top: 80px;          /* form cách đỉnh bản đồ 80px */
        left: 0;
        right: 0;
        z-index: 3;
    }
    .bc-contact-block .map-form{
        margin: 0;
    }
    /* Band chừa lề trên cho đáy form thò xuống, chữ không bị che */
    .bc-contact-block section.layout-pt-md{
        padding-top: 90px;
    }
}

/*---- Pagination tin tức: gom gọn, căn giữa, KHÔNG tràn/rớt dòng ở desktop ----*/
.bc-news .bc-pagination{ text-align: center; }
/* hàng ngoài: bỏ space-between (đẩy nút ra 2 mép gây tràn) → căn giữa, sát nhau */
.bc-news .bc-pagination .custom-pagination > .row{
    justify-content: center !important;
    align-items: center;
    column-gap: 8px;
    row-gap: 10px;
    margin-left: 0;
    margin-right: 0;
    flex-wrap: wrap;
}
.bc-news .bc-pagination .custom-pagination > .row > [class*="col-"]{
    padding-left: 0;
    padding-right: 0;
}
/* hàng số trang: thu nhỏ khoảng cách, không xuống dòng giữa các số */
.bc-news .bc-pagination .custom-pagination .row.items-center{
    flex-wrap: nowrap;
    column-gap: 4px;
    margin-left: 0;
    margin-right: 0;
}
.bc-news .bc-pagination .custom-pagination .row.items-center > [class*="col-"]{
    padding-left: 2px;
    padding-right: 2px;
}
/* nút prev/next & số trang gọn lại */
.bc-news .bc-pagination .custom-pagination .size-40{
    height: 36px !important;
    width: 36px !important;
    min-width: 36px;
}
.bc-news .bc-pagination .count-string{
    display: block;
    margin-top: 14px;
    text-align: center;
    color: #768090;
    font-size: 14px;
}

/*---- Mega-menu "Tour nước ngoài": TAB ngang châu lục → danh sách nước bên dưới ----*/
.header-menu .menu li.-has-mega-menu{ position: relative; }
.header-menu .menu .mega.mega--abroad{
    width: 620px;
    max-width: calc(100vw - 32px);
    left: 50%;
    transform: translateX(-50%);
    padding: 18px 24px 20px;
    border-radius: 6px;       /* bo góc nhẹ, không quá tròn */
}
.mega-abroad{ display: block; }

/* Hàng tab châu lục NẰM NGANG — giãn đều kín chiều ngang */
.mega-abroad__nav{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #e6e9f0;
    margin-bottom: 16px;
}
.header-menu .menu .mega.mega--abroad .mega-abroad__tab{
    position: relative;
    padding: 2px 2px 12px !important;
    background: transparent;
    border: 0;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #1a2b48;
    cursor: pointer;
    white-space: nowrap;
    transition: color .18s ease;
}
.header-menu .menu .mega.mega--abroad .mega-abroad__tab::after{
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -1px;
    height: 2px;
    background: var(--color-blue-1, #3554D1);
    transform: scaleX(0);
    transition: transform .18s ease;
}
.header-menu .menu .mega.mega--abroad .mega-abroad__tab:hover,
.header-menu .menu .mega.mega--abroad .mega-abroad__tab.-active{
    color: var(--color-blue-1, #3554D1);
}
.header-menu .menu .mega.mega--abroad .mega-abroad__tab.-active::after{ transform: scaleX(1); }

/* Khung nội dung nước bên dưới — ôm sát nội dung, không tạo khoảng trống thừa */
.mega-abroad__panes{ position: relative; }
/* Nội địa: cố định chiều cao = tab cao nhất (Miền Trung 3 hàng) → đổi tab KHÔNG nhảy */
.mega.mega--domestic .mega-abroad__panes{ min-height: 134px; }
.mega-abroad__pane{ display: none; }
.mega-abroad__pane.-active{ display: block; animation: megaAbroadFade .2s ease; }
@keyframes megaAbroadFade{ from{ opacity: 0; transform: translateY(4px); } to{ opacity: 1; transform: none; } }

.mega-abroad__list{
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, 168px); /* px CỐ ĐỊNH → cột đứng yên một chỗ ở MỌI tab (ul co theo nội dung nên 1fr bị lệch) */
    justify-content: start;
    gap: 2px 20px;
}
.mega-abroad__list li{ margin: 0; }
/* override rule theme `.header-menu .menu a{justify-content:space-between;height:50px}`
   → cờ + tên dính liền bên trái, hàng gọn lại */
.header-menu .menu .mega.mega--abroad .mega-abroad__list a{
    display: flex !important;
    align-items: center;
    justify-content: flex-start !important;
    gap: 10px;
    height: auto !important;
    padding: 7px 0 !important;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    color: #1a2b48;
    white-space: nowrap;
    transition: color .2s ease;
}
.header-menu .menu .mega.mega--abroad .mega-abroad__list a:hover{ color: var(--color-blue-1, #3554D1); }
.mega-abroad__flag{
    width: 27px;
    height: 20px;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 0 0 1px rgba(5,16,54,.10);
    flex: 0 0 auto;
}
/* icon ghim cho "Tour nội địa" (thay cờ) */
.mega-abroad__pin{
    width: 27px;
    flex: 0 0 auto;
    text-align: center;
    font-size: 15px;
    color: var(--color-blue-1, #3554D1);
}
.mega-abroad__all{
    display: inline-block;
    margin-top: 14px;
    font-size: 13px;
    font-weight: 600;
    color: #8a93a3;
    transition: color .2s ease;
}
.mega-abroad__all:hover{ color: var(--color-blue-1, #3554D1); }
@media (max-width: 991px){
    .header-menu .menu .mega.mega--abroad{ display: none !important; }
}

/* ---- Mega-menu trên MOBILE (≤1199): mở dạng accordion ngay trong menu ----
   Desktop hiển thị popup khi hover; mobile không hover được nên click cha
   ("Tour nội địa"/"Tour nước ngoài") sẽ bung nội dung tại chỗ (JS thêm class
   .mobile-mega-open). Ép mega từ popup absolute -> khối tĩnh trong luồng. */
@media (max-width: 1199px){
    .header .header-menu .menu li.mega-abroad > .mega.mega--abroad,
    .header .header-menu .menu li.mega-domestic > .mega.mega--abroad{
        display: none !important;          /* mặc định gập */
        position: static !important;
        transform: none !important;
        left: auto !important; right: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 2px 0 10px 14px !important;
        margin-top: 2px;
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }
    .header .header-menu .menu li.mobile-mega-open > .mega.mega--abroad{
        display: block !important;         /* bung khi bấm cha */
    }
    /* panel con: thụt lề + viền trái mảnh + nền nhẹ để tách khỏi menu cha (mềm, không cứng) */
    .header .header-menu .menu li.mega-abroad > .mega.mega--abroad,
    .header .header-menu .menu li.mega-domestic > .mega.mega--abroad{
        margin: 4px 0 6px 8px !important;
        padding: 12px 14px !important;
        border-left: 2px solid rgba(53,84,209,.25) !important;
        background: rgba(53,84,209,.035) !important;
        border-radius: 0 8px 8px 0 !important;
    }
    /* chevron của item cha xoay khi mở */
    .header .header-menu .menu li.mega-abroad > a .icon-chevron-sm-down,
    .header .header-menu .menu li.mega-domestic > a .icon-chevron-sm-down{
        transition: transform .25s ease;
    }
    .header .header-menu .menu li.mobile-mega-open > a .icon-chevron-sm-down{
        transform: rotate(180deg);
    }
    /* tab châu lục / miền: dạng "chip" mềm, tự xuống dòng, không viền cứng */
    .mega-abroad__nav{
        flex-wrap: wrap;
        gap: 8px !important;
        border-bottom: 0 !important;
        margin-bottom: 12px !important;
        justify-content: flex-start !important;
    }
    .header-menu .menu .mega.mega--abroad .mega-abroad__tab{
        font-size: 12.5px !important;
        font-weight: 600 !important;
        text-transform: none !important;
        letter-spacing: 0 !important;
        padding: 6px 12px !important;
        border-radius: 20px !important;
        background: #fff !important;
        border: 1px solid #e2e7f2 !important;
        color: #3b465f !important;
        white-space: nowrap;
    }
    .header-menu .menu .mega.mega--abroad .mega-abroad__tab.-active{
        background: #3554D1 !important;
        border-color: #3554D1 !important;
        color: #fff !important;
    }
    /* bỏ gạch chân active (đã dùng nền chip) */
    .header-menu .menu .mega.mega--abroad .mega-abroad__tab::after{ display: none !important; }
    .mega.mega--domestic .mega-abroad__panes{ min-height: 0 !important; }
    /* danh sách nước: cột co giãn tự nhiên, không ép grid cứng */
    .mega-abroad__list{
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;
        gap: 2px 14px !important;
    }
    .header-menu .menu .mega.mega--abroad .mega-abroad__list a{
        font-size: 13.5px !important;
        padding: 7px 0 !important;
    }
    .mega-abroad__all{ margin-top: 10px !important; }
}

/* ===== Tour Đoàn / Khách Đoàn landing (block group_tour_landing) ===== */
.group-tour-landing .gtl-hero{
    position: relative;
    background-color: #0b1733;
    background-size: cover;
    background-position: center;
    padding: 110px 0 90px;
}
.group-tour-landing .gtl-hero__overlay{
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(5,16,54,.55), rgba(5,16,54,.75));
}
.group-tour-landing .gtl-hero__inner{ position: relative; z-index: 1; }
.group-tour-landing .gtl-hero__title{ color:#fff; font-size: 44px; line-height: 1.15; font-weight: 700; }
.group-tour-landing .gtl-hero__sub{ color:#e7ecf5; font-size: 17px; margin-top: 14px; }
@media (max-width: 767px){
    .group-tour-landing .gtl-hero{ padding: 70px 0 56px; }
    .group-tour-landing .gtl-hero__title{ font-size: 30px; }
}
/* Form đăng ký khách đoàn */
.group-tour-landing .gtl-sec{
    font-size: 18px; font-weight: 600;
    color: var(--color-dark-1, #051036);
    padding-bottom: 10px; margin-bottom: 22px;
    border-bottom: 2px solid var(--color-blue-1, #3554D1);
}
.group-tour-landing .gtl-field{ margin-top: 22px; }
.group-tour-landing .gtl-label{ font-size: 14px; font-weight: 500; color:#697488; margin-bottom: 10px; }
.group-tour-landing .gtl-checks{ display: flex; flex-wrap: wrap; gap: 10px 26px; }
.group-tour-landing .gtl-check{ display: inline-flex; align-items: center; gap: 8px; margin: 0; cursor: pointer; font-size: 14px; color:#1b2436; }
.group-tour-landing .gtl-check input{ width: 17px; height: 17px; accent-color: var(--color-blue-1, #3554D1); }
/* Ô chọn ngày: mô phỏng đúng .form-input (label nổi trên, value dưới) để đồng bộ với các ô còn lại.
   Date input luôn hiển thị value nên label luôn ở vị trí "đã nổi". */
.group-tour-landing .gtl-datefield{ position: relative; display: block; }
.group-tour-landing .gtl-datefield > label{
    position: absolute; top: 14px; left: 0; padding: 0 15px;
    font-size: 12px; color:#697488; pointer-events: none; z-index: 1;
}
.group-tour-landing .gtl-datefield > input[type="date"]{
    width: 100%; min-height: 70px; border: 1px solid var(--color-border, #dee2e6);
    border-radius: 4px; padding: 25px 15px 0; color:#1b2436; background:#fff;
}
.group-tour-landing .gtl-datefield > input[type="date"]:focus{
    outline: none; border: 2px solid #051036;
}

/* ===== Trang Hình ảnh (module Gallery) ===== */
.bc-gallery__header{
    background: linear-gradient(120deg, #0b1733, #1f3b86);
    color:#fff; text-align:center; padding: 64px 0 56px;
}
.bc-gallery__title{ color:#fff; font-size: 38px; font-weight: 700; }
.bc-gallery__sub{ color:#dbe3f4; font-size: 16px; margin-top: 8px; }
.bc-gallery__tabs{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom: 34px; }
.bc-gallery__tab{
    border: 1px solid #e0e3ea; background:#fff; color:#1b2436;
    padding: 9px 20px; border-radius: 30px; font-size: 14px; font-weight: 500; cursor:pointer;
    transition: all .2s ease;
}
.bc-gallery__tab:hover{ border-color: var(--color-blue-1, #3554D1); color: var(--color-blue-1, #3554D1); }
.bc-gallery__tab.-active{ background: var(--color-blue-1, #3554D1); border-color: var(--color-blue-1, #3554D1); color:#fff; }
.bc-gallery__grid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
@media (max-width: 991px){ .bc-gallery__grid{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px){ .bc-gallery__grid{ grid-template-columns: repeat(2, 1fr); } }
.bc-gallery__media{
    position: relative; display:block; overflow:hidden;
    border-radius: 6px; aspect-ratio: 4/3;
}
.bc-gallery__media img{ width:100%; height:100%; object-fit: cover; transition: transform .35s ease; }
.bc-gallery__media:hover img{ transform: scale(1.06); }
.bc-gallery__play{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    background: rgba(5,16,54,.35); color:#fff; font-size: 20px;
}
.bc-gallery__play i{
    width: 52px; height: 52px; border-radius:50%;
    background: rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center;
    backdrop-filter: blur(2px);
}

/* ===================================================================
   TRANG GIỚI THIỆU (/about-us) — blocks: about_hero/intro/timeline/
   partners + gallery_preview. Bố cục tham khảo saigontimestravel.com,
   màu thương hiệu VietnamTourist (#3554D1 / #051036).
   =================================================================== */

/* Nhãn nhỏ (eyebrow) trên tiêu đề các section */
.about-eyebrow{
    display:inline-block; font-size:13px; font-weight:600; letter-spacing:.14em;
    text-transform:uppercase; color:#3554D1; margin-bottom:12px;
    position:relative; padding-left:34px;
}
.about-eyebrow::before{
    content:""; position:absolute; left:0; top:50%; width:24px; height:2px;
    background:#3554D1; transform:translateY(-50%);
}

/* --- Hero --- */
.about-hero{
    position:relative; background-color:#0b1733; background-size:cover;
    background-position:center; padding:120px 0 96px;
}
.about-hero__overlay{
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(5,16,54,.55), rgba(5,16,54,.78));
}
.about-hero__inner{ position:relative; z-index:1; }
.about-hero__label{
    display:inline-block; color:#fff; font-size:13px; font-weight:600;
    letter-spacing:.16em; text-transform:uppercase; margin-bottom:14px;
    padding:6px 16px; border:1px solid rgba(255,255,255,.4); border-radius:30px;
}
.about-hero__title{ color:#fff; font-size:46px; line-height:1.12; font-weight:700; }
.about-hero__sub{ color:#e7ecf5; font-size:17px; margin-top:16px; max-width:720px; margin-left:auto; margin-right:auto; }
.about-hero__crumb{ color:#c7d0e3; font-size:14px; margin-top:20px; }
.about-hero__crumb a{ color:#fff; }
.about-hero__crumb a:hover{ color:#3554D1; }
@media (max-width:767px){
    .about-hero{ padding:80px 0 60px; }
    .about-hero__title{ font-size:30px; }
}

/* --- Intro (text + image/video + stats) --- */
.about-intro__title{ font-size:34px; line-height:1.2; font-weight:700; color:#051036; }
.about-intro__content{ color:#56607a; font-size:16px; line-height:1.8; }
.about-intro__content p{ margin-bottom:14px; }
.about-intro__content strong{ color:#051036; }
.about-intro__content ul{ list-style:none; margin:0 0 16px; padding:0; }
.about-intro__content ul li{ position:relative; padding-left:30px; margin-bottom:10px; color:#56607a; }
.about-intro__content ul li::before{
    content:"\f00c"; font-family:FontAwesome; font-size:13px;
    position:absolute; left:0; top:2px; width:20px; height:20px; line-height:20px; text-align:center;
    color:#3554D1; background:rgba(53,84,209,.10); border-radius:50%;
}
/* Media lấp đầy CHIỀU CAO cột chữ (object-fit cover) để 2 cột luôn cân, không hở trắng */
.about-intro__media{ height:100%; min-height:360px; }
.about-intro__img{
    display:block; width:100%; height:100%; min-height:360px; object-fit:cover;
    border-radius:10px; box-shadow:0 18px 40px rgba(5,16,54,.14);
}
.about-intro__facade{
    position:relative; display:block; width:100%; height:100%; min-height:360px;
    border-radius:10px; overflow:hidden; cursor:pointer; background:#0b1733;
    box-shadow:0 18px 40px rgba(5,16,54,.14);
}
.about-intro__facade img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.about-intro__facade::after{ content:""; position:absolute; inset:0; background:rgba(5,16,54,.30); transition:background .3s ease; }
.about-intro__facade:hover img{ transform:scale(1.04); }
.about-intro__facade:hover::after{ background:rgba(5,16,54,.44); }
.about-intro__facade.-playing{ cursor:default; }
.about-intro__facade.-playing::after{ display:none; }
.about-intro__facade iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; z-index:2; }
.about-intro__play{
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:1;
    width:74px; height:74px; border-radius:50%; border:0; cursor:pointer;
    background:#3554D1; color:#fff; font-size:24px; padding-left:5px;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 10px 26px rgba(53,84,209,.55); transition:transform .25s ease;
}
.about-intro__facade:hover .about-intro__play{ transform:translate(-50%,-50%) scale(1.1); }
.about-intro__video{
    position:relative; width:100%; height:100%; min-height:360px; border-radius:10px; overflow:hidden;
    box-shadow:0 18px 40px rgba(5,16,54,.14);
}
.about-intro__video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
@media (max-width:991px){
    .about-intro__media, .about-intro__img, .about-intro__facade, .about-intro__video{ min-height:260px; }
}

.about-stats{ border-top:1px solid #e6e9f0; padding-top:46px; }
.about-stats__num{ font-size:42px; line-height:1.1; font-weight:700; color:#3554D1; }
.about-stats__label{ font-size:14px; color:#56607a; margin-top:8px; }
@media (max-width:767px){
    .about-intro__title{ font-size:26px; }
    .about-stats__num{ font-size:32px; }
}

/* --- Features (Tầm nhìn/Sứ mệnh/Giá trị + Dịch vụ) --- */
/* Section nền xanh nhẹ (option background=soft) — tách "Cam kết" khỏi 2 section trắng liền kề */
.about-features--soft{ background:#eef2fb; }

/* Giảm khoảng trống: các block about đang dùng layout-pt-xl/lg quá cao */
.about-intro{ padding-top:84px !important; padding-bottom:60px !important; }
.about-features{ padding-top:64px !important; padding-bottom:64px !important; }
.about-videos{ padding-top:52px !important; padding-bottom:64px !important; }
.about-features .pt-50, .about-videos .pt-50{ padding-top:34px !important; }

.about-feature-card{
    height:100%; background:#fff; border:1px solid #d7deec; border-radius:12px;
    padding:38px 28px; text-align:center; box-shadow:0 1px 2px rgba(5,16,54,.04);
    transition:box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
.about-feature-card:hover{ box-shadow:0 18px 40px rgba(5,16,54,.12); transform:translateY(-5px); border-color:#3554D1; }
/* Trên nền xanh nhẹ, viền card dịu hơn cho hợp tông */
.about-features--soft .about-feature-card{ border-color:#dbe3f4; }
.about-feature-card__icon{
    width:84px; height:84px; margin:0 auto 22px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:rgba(53,84,209,.08);
}
.about-feature-card__icon img{ max-width:44px; max-height:44px; object-fit:contain; }
.about-feature-card__title{ font-size:19px; font-weight:600; color:#051036; }
.about-feature-card__desc{ font-size:15px; line-height:1.7; color:#56607a; margin-top:12px; }

/* --- Timeline (tabs theo năm) --- */
.about-timeline{ background:#f7f9fc; }
.about-timeline__nav{
    display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
    position:relative;
}
.about-timeline__nav::before{
    content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:#e1e6f0;
}
.about-timeline__year{
    position:relative; border:0; background:transparent; cursor:pointer;
    font-size:18px; font-weight:700; color:#9aa3b7; padding:10px 22px 16px;
    transition:color .2s ease;
}
.about-timeline__year::after{
    content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:3px;
    background:#3554D1; border-radius:2px; transform:scaleX(0); transition:transform .25s ease; z-index:1;
}
.about-timeline__year:hover{ color:#051036; }
.about-timeline__year.-active{ color:#3554D1; }
.about-timeline__year.-active::after{ transform:scaleX(1); }

.about-timeline__pane{ display:none; }
.about-timeline__pane.-active{ display:block; animation:aboutFade .3s ease; }
@keyframes aboutFade{ from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;} }
.about-timeline__img{ width:100%; height:380px; object-fit:cover; box-shadow:0 16px 36px rgba(5,16,54,.14); }
.about-timeline__badge{
    display:inline-block; background:#3554D1; color:#fff; font-weight:700;
    font-size:14px; letter-spacing:.04em; padding:6px 16px; border-radius:30px;
}
.about-timeline__heading{ font-size:26px; font-weight:700; color:#051036; }
.about-timeline__desc{ color:#56607a; font-size:16px; line-height:1.8; }
@media (max-width:767px){
    .about-timeline__img{ height:240px; }
    .about-timeline__year{ font-size:15px; padding:8px 14px 14px; }
}

/* --- Videos (facade YouTube, bấm để chạy) --- */
.about-video__frame{
    position:relative; width:100%; padding-top:56.25%; border-radius:10px; overflow:hidden;
    cursor:pointer; background:#0b1733; box-shadow:0 14px 32px rgba(5,16,54,.14);
}
.about-video__frame img{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .4s ease;
}
.about-video__frame::after{
    content:""; position:absolute; inset:0; background:rgba(5,16,54,.28); transition:background .3s ease;
}
.about-video__frame:hover img{ transform:scale(1.05); }
.about-video__frame:hover::after{ background:rgba(5,16,54,.42); }
.about-video__frame.-playing{ cursor:default; }
.about-video__frame.-playing::after{ display:none; }
.about-video__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; z-index:2; }
.about-video__play{
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:1;
    width:68px; height:68px; border-radius:50%; border:0; cursor:pointer;
    background:#3554D1; color:#fff; font-size:22px; padding-left:5px;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 22px rgba(53,84,209,.5); transition:transform .25s ease, background .25s ease;
}
.about-video__frame:hover .about-video__play{ transform:translate(-50%,-50%) scale(1.1); }
.about-video__title{ margin-top:16px; font-size:16px; font-weight:600; color:#051036; text-align:center; }

/* --- Partners (logo grid) --- */
.about-partners__grid{
    display:grid; grid-template-columns:repeat(6,1fr); gap:24px; align-items:center;
}
.about-partners__item{
    display:flex; align-items:center; justify-content:center;
    background:#fff; border:1px solid #eef1f6; border-radius:8px; padding:22px 18px;
    min-height:96px; transition:box-shadow .25s ease, transform .25s ease;
}
.about-partners__item:hover{ box-shadow:0 12px 26px rgba(5,16,54,.10); transform:translateY(-3px); }
.about-partners__item img{
    max-width:100%; max-height:54px; object-fit:contain;
    filter:grayscale(100%); opacity:.7; transition:filter .25s ease, opacity .25s ease;
}
.about-partners__item:hover img{ filter:none; opacity:1; }
@media (max-width:991px){ .about-partners__grid{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:575px){ .about-partners__grid{ grid-template-columns:repeat(2,1fr); } }

/* --- Gallery preview (cuối trang, có nút Xem thêm) --- */
.gallery-preview__grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:16px;
}
.gallery-preview__item{
    position:relative; display:block; overflow:hidden; border-radius:8px; aspect-ratio:4/3;
}
.gallery-preview__item img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.gallery-preview__item::after{
    content:""; position:absolute; inset:0; background:rgba(5,16,54,0); transition:background .3s ease;
}
.gallery-preview__item:hover img{ transform:scale(1.07); }
.gallery-preview__item:hover::after{ background:rgba(5,16,54,.18); }
@media (max-width:991px){ .gallery-preview__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:575px){ .gallery-preview__grid{ grid-template-columns:repeat(2,1fr); } }

/* ===================================================================
   FOOTER — bố cục lại theo nội dung VietnamTourist (giữ widget admin),
   tông tối sang trọng, accent màu thương hiệu. Tham khảo bố cục đa cột
   của saigontimestravel.com.
   =================================================================== */
.footer.normal{
    background:#0b1733; color:#c4cce0;
    background-image:radial-gradient(1200px 380px at 85% -10%, rgba(53,84,209,.22), transparent 60%);
}
.footer.normal .container{ position:relative; }
.footer.normal .footer_one--branded{
    border-bottom:1px solid rgba(255,255,255,.08);
}

/* Tiêu đề cột */
.footer.normal .footer-widget__title{
    color:#fff; font-size:16px; font-weight:600; letter-spacing:.01em;
    margin-bottom:24px; padding-bottom:12px; position:relative;
}
.footer.normal .footer-widget__title::after{
    content:""; position:absolute; left:0; bottom:0; width:34px; height:2px;
    background:#3554D1; border-radius:2px;
}

/* Liên kết trong cột */
.footer.normal .footer-widget__body a{
    color:#aeb8d2; transition:color .2s ease, padding-left .2s ease; text-decoration:none;
}
.footer.normal .footer-widget__body .d-flex.flex-column a,
.footer.normal .footer-widget__body a.footer-link{
    display:inline-flex; align-items:center; padding:3px 0;
}
.footer.normal .footer-widget__body .d-flex.flex-column a:hover,
.footer.normal .footer-widget__body a:hover{ color:#fff; }
.footer.normal .footer-widget__body .d-flex.flex-column a:hover{ padding-left:6px; }
.footer.normal .footer-widget__body{ color:#aeb8d2; font-size:15px; line-height:1.7; }
.footer.normal .footer-widget__body .text-14{ color:#8b97b8; }

/* Cột thương hiệu (widget đầu) */
.footer-widget--brand .footer-desc{ color:#aeb8d2; font-size:15px; line-height:1.8; margin-bottom:22px; }
.footer-brand-logo{ max-height:46px; width:auto; margin-bottom:20px; }
.footer-socials{ display:flex; gap:10px; margin-top:8px; }
.footer-socials a{
    width:40px; height:40px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    background:rgba(255,255,255,.08); color:#fff !important; font-size:16px;
    transition:background .2s ease, transform .2s ease;
}
.footer-socials a:hover{ background:#3554D1; transform:translateY(-3px); }

/* Dòng liên hệ có icon */
.footer-contact-item{ display:flex; gap:12px; align-items:flex-start; margin-bottom:16px; }
.footer-contact-item i{ color:#3554D1; font-size:17px; margin-top:3px; width:18px; text-align:center; }
.footer-contact-item span,
.footer-contact-item a{ color:#c4cce0; font-size:15px; line-height:1.6; }
.footer-contact-item a:hover{ color:#fff; }

/* Thanh dưới cùng (copyright) */
.footer.normal .footer_middle_area{ border-top:1px solid rgba(255,255,255,.08) !important; }
.footer.normal .footer_middle_area,
.footer.normal .footer_middle_area p{ color:#8b97b8; font-size:14px; }
.footer.normal .footer_middle_area a{ color:#c4cce0; }
.footer.normal .footer_middle_area a:hover{ color:#fff; }

@media (max-width:991px){
    .footer.normal .footer_one--branded{ padding-top:56px; }
}

/* ===================================================================
   TINH CHỈNH MOBILE — Topbar, Navbar (header), CTA đăng ký
   =================================================================== */

/* ---- 1) NAVBAR: header vốn là position:absolute; top:40px (canh theo topbar
   1 dòng ~40px của desktop). Trên mobile topbar cao 2 dòng (~120–200px) nên
   logo + nút menu bị topbar CHE MẤT (chỉ hiện lại khi cuộn → header dính).
   Fix: khi CHƯA dính (not .is-sticky) cho header về luồng thường, nền tối,
   logo sáng + icon trắng. Lúc dính vẫn để theme tự xử lý. ---- */
@media (max-width: 991px){
    /* topbar vốn position:absolute (đè lên header). Cho về luồng thường để header
       nằm NGAY DƯỚI topbar (không bị che logo/nút menu) dù topbar cao bao nhiêu */
    .gotrip-topbar{ position: relative !important; }
    /* .header-margin là spacer theme chèn để chừa chỗ cho header absolute; giờ
       topbar + header đã nằm trong luồng nên spacer thừa → gây khoảng trắng trên
       các trang nội dung (header-normal). Ẩn đi. */
    .header-margin{ display: none !important; }
    .bc_header.header:not(.is-sticky){
        position: relative !important;
        top: 0 !important;
        margin-top: 0 !important;
        background: #0b1733 !important;
    }
    .bc_header.header:not(.is-sticky) .header-logo img.logo-dark{ display: none !important; }
    .bc_header.header:not(.is-sticky) .header-logo img.logo-light{ display: inline-block !important; }
    .bc_header.header:not(.is-sticky) .icon-menu,
    .bc_header.header:not(.is-sticky) .icon-user,
    .bc_header.header:not(.is-sticky) .menu__nav{ color: #fff !important; }
    /* logo hơi nhỏ lại + căn giữa dọc cho gọn */
    .bc_header.header:not(.is-sticky) .header-logo img{ max-height: 34px; width: auto; }
}

/* ---- 2) TOPBAR gọn 1 dòng trên mobile: ẩn câu "thành viên hiệp hội" (dài 2
   dòng, chiếm chỗ), chỉ giữ Hotline + tài khoản; thêm icon điện thoại ---- */
@media (max-width: 767px){
    .gotrip-topbar{ padding-top: 9px; padding-bottom: 9px; }
    .gotrip-topbar > .container > .row{ flex-wrap: nowrap; justify-content: center !important; }
    .gotrip-topbar > .container > .row > .col-auto:first-child{ display: none; }   /* ẩn membership */
    .gotrip-topbar > .container > .row > .col-auto:last-child{ width: 100%; }
    .gotrip-topbar .row.x-gap-15{ justify-content: center; width: 100%; }
    .gotrip-topbar .text-12{ font-size: 12.5px; }
    /* icon điện thoại trước số hotline (link tel còn lại duy nhất trên mobile) */
    .gotrip-topbar a[href^="tel:"]{ display: inline-flex; align-items: center; }
    .gotrip-topbar a[href^="tel:"]::before{
        content: "\f095"; font-family: FontAwesome; font-weight: 400;
        margin-right: 7px; font-size: 13px; color: #ffffff;
    }
}

/* ---- 3) CTA ĐĂNG KÝ (subscribe style_1) ---- */
/* Fix spinner quay mãi: theme chỉ ẩn khi có .mailchimp bọc ngoài (block này không
   có) → thêm rule ẩn mặc định, chỉ hiện khi đang gửi (.loading). Áp dụng cả desktop. */
.bc-subscribe-form .button .fa-spinner{ margin-left: 6px; display: none; }
.bc-subscribe-form.loading .button .fa-spinner{ display: inline-block; }

/* Mobile: ảnh thấp lại, ô email + nút xếp dọc, nút full-width */
@media (max-width: 767px){
    .newsletter-media{ min-height: 200px !important; }
    .bc-subscribe-form{ flex-direction: column; }
    .bc-subscribe-form > div{ width: 100%; flex: 1 1 100% !important; }
    .bc-subscribe-form .button{ width: 100%; justify-content: center; }
}

/* ===================================================================
   BẢNG trong nội dung tour (Overview / Itinerary) — dữ liệu WordPress
   nhúng <table> thô (lịch khởi hành, giá vé, chuyến bay...). Table dùng
   <td> + colspan/rowspan (header 2 tầng), KHÔNG có <th>/<thead>. Vì vậy:
   - Header = 2 hàng đầu (hàng 1 gộp GIÁ BÁN, hàng 2 tách người lớn/trẻ em).
   - KHÔNG dùng zebra-stripe (đá nhau với rowspan → lệch).
   =================================================================== */
/* Chặn bảng (hoặc nội dung rộng) tràn sang cột sidebar: cột nội dung tự cuộn
   ngang trong phạm vi của nó thay vì đè lên form đặt tour bên phải. */
.bc_detail_tour .content-text{ overflow-x: auto; max-width: 100%; }

.bc_detail_tour .content-text table,
.bc_detail_tour .tour-itinerary table,
.bc_detail_tour .accordion__content table{
    width: 100% !important;
    max-width: 100%;
    height: auto !important;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 15px;
    color: #1b2436;
    background: #fff;
    border: 1px solid #d7deec;
    border-radius: 10px;
    overflow: hidden;               /* bo góc ăn vào cell */
    /* fixed: chia bề rộng theo <colgroup>/hàng đầu, KHÔNG để auto-layout bóp
       cột giá về 0px (thủ phạm khiến số "14.390.000" rơi dọc từng chữ số). */
    table-layout: fixed;
    box-shadow: 0 4px 18px rgba(5,16,54,.06);
}
/* Ép bỏ width lớn mà WP gắn sẵn (colgroup/inline) — nếu không, fixed-layout sẽ
   cho 2 cột đầu (NGÀY KHỞI HÀNH / CHUYẾN BAY) chiếm hết chỗ, đẩy cột giá EM BÉ
   ra ngoài khung. width:auto → fixed-layout chia đều các cột cho cân đối. */
.bc_detail_tour .content-text table col,
.bc_detail_tour .content-text table td,
.bc_detail_tour .content-text table th,
.bc_detail_tour .tour-itinerary table col,
.bc_detail_tour .tour-itinerary table td,
.bc_detail_tour .tour-itinerary table th{
    width: auto !important;
}
/* Cột đầu (NGÀY KHỞI HÀNH + các ô THÁNG…) hẹp lại, để dành chỗ cho cột giá. */
.bc_detail_tour .content-text table tr td:first-child,
.bc_detail_tour .content-text table tr th:first-child{ width: 22% !important; }
/* Ô: viền nhẹ, padding thoáng, canh giữa, xuống dòng gọn */
.bc_detail_tour .content-text table td,
.bc_detail_tour .content-text table th,
.bc_detail_tour .tour-itinerary table td,
.bc_detail_tour .tour-itinerary table th,
.bc_detail_tour .accordion__content table td,
.bc_detail_tour .accordion__content table th{
    border: 1px solid #e6e9f2;
    padding: 10px 8px;
    vertical-align: middle;
    line-height: 1.5;
    text-align: center;
    /* KHÔNG dùng break-word/break-all: sẽ bẻ "14.390.000" thành từng chữ số
       dọc → cột co còn ~1 ký tự → vỡ bảng. word-break normal giữ số nguyên
       khối (không có điểm ngắt), text có dấu cách vẫn xuống dòng bình thường. */
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    height: auto !important;        /* bỏ height cứng của WP (height:56px…) */
}
.bc_detail_tour .content-text table td *,
.bc_detail_tour .tour-itinerary table td *{ font-size: inherit; }

/* HEADER — 2 hàng đầu. Hàng 1 xanh đậm (màu thương hiệu), chữ trắng. */
.bc_detail_tour .content-text table tr:first-child td,
.bc_detail_tour .content-text table tr:first-child th,
.bc_detail_tour .tour-itinerary table tr:first-child td,
.bc_detail_tour .accordion__content table tr:first-child td{
    background: #3554D1;
    color: #fff !important;
    font-weight: 700;
    border-color: rgba(255,255,255,.25);
}
.bc_detail_tour .content-text table tr:first-child td *,
.bc_detail_tour .tour-itinerary table tr:first-child td *,
.bc_detail_tour .accordion__content table tr:first-child td *{ color:#fff !important; }

/* Hàng 2 = header phụ (Người lớn / Trẻ em / Em bé): xanh nhạt, chữ đậm navy */
.bc_detail_tour .content-text table tr:nth-child(2) td,
.bc_detail_tour .tour-itinerary table tr:nth-child(2) td{
    background: #eef2fb;
    color: #051036;
    font-weight: 700;
}
/* Ô header dùng rowspan (NGÀY KHỞI HÀNH, CHUYẾN BAY) nằm ở hàng 1 nên đã xanh
   đậm & phủ xuống hàng 2 — không cần xử lý thêm. */

/* DATA: cột đầu (THÁNG…/nội dung) canh trái đậm cho dễ đọc */
.bc_detail_tour .content-text table tr:nth-child(n+3) td:first-child,
.bc_detail_tour .tour-itinerary table tr:nth-child(n+3) td:first-child{
    text-align: left;
    font-weight: 600;
    color: #051036;
}
/* Không dùng nowrap: số tiền "15.490.000" không có dấu cách nên với
   word-break:normal đã tự giữ nguyên khối. nowrap sẽ khiến chuỗi chuyến bay
   dài (VJ3674 | … | …) tràn ra ngoài ô. */
/* Hàng data hover nhẹ */
.bc_detail_tour .content-text table tr:nth-child(n+3):hover td{ background: #f6f8fc; }

/* Mobile: cho bảng cuộn ngang thay vì bóp méo chữ. */
@media (max-width: 767px){
    .bc_detail_tour .content-text table,
    .bc_detail_tour .tour-itinerary table,
    .bc_detail_tour .accordion__content table{
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        font-size: 14px;
    }
    .bc_detail_tour .content-text table tbody,
    .bc_detail_tour .tour-itinerary table tbody{ display: table; width: max-content; min-width: 100%; }
    .bc_detail_tour .content-text table td,
    .bc_detail_tour .content-text table th,
    .bc_detail_tour .tour-itinerary table td{
        padding: 10px 12px;
    }
}

/* ===================================================================
   SIDEBAR ĐẶT TOUR — "Lịch trình" (bố cục theo mẫu saigontimes, MÀU
   theo thương hiệu site: xanh #3554D1 / navy #051036). Giữ
   nguyên chức năng đặt tour (Vue app), chỉ đổi cấu trúc hiển thị.
   =================================================================== */
.bc_detail_tour .tour-sb{ width:100%; padding:24px 22px; }
.tour-sb__head{ border-bottom:1px solid #eef1f6; padding-bottom:14px; margin-bottom:16px; }
.tour-sb__title{ font-size:20px; font-weight:700; color:#051036; margin:0; }

.tour-sb__row{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.tour-sb__label{ font-size:14px; color:#697488; flex:0 0 auto; }
.tour-sb__value{ font-size:14px; color:#051036; font-weight:500; text-align:right; }
.tour-sb__field{ margin-bottom:12px; }
.tour-sb__field .tour-sb__row{ margin-bottom:10px; }
.tour-sb__badge{
    display:inline-block; background:#3554D1; color:#fff; font-weight:600;
    font-size:13px; padding:5px 14px; border-radius:6px;
}
.tour-sb__btn-alt{
    display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600;
    color:#3554D1; border:1px solid #dfe3ec; border-radius:8px; padding:9px 15px;
    cursor:pointer; transition:all .2s ease;
}
.tour-sb__btn-alt:hover{ border-color:#3554D1; background:#f4f6fd; }
.tour-sb__divider{ height:1px; background:#eef1f6; margin:16px 0; }

/* Hàng khách theo loại (Người lớn / Trẻ em / Trẻ nhỏ) */
.tour-sb__pax{ display:flex; align-items:center; gap:8px; margin-bottom:14px; }
/* Cột tên nở ra để đẩy bộ đếm sang phải; KHÔNG cho xuống dòng (min-width tự
   giữ chỗ theo nội dung nên nút −/+ luôn thẳng cột). */
.tour-sb__pax-info{ flex:1 1 auto; }
.tour-sb__pax-name{ font-size:15px; font-weight:600; color:#051036; line-height:1.3; white-space:nowrap; }
.tour-sb__pax-desc{ font-size:12px; color:#8a93a3; }
.tour-sb__counter{ display:inline-flex; align-items:center; gap:3px; flex:0 0 auto; }
.tour-sb__cbtn{
    width:28px; height:28px; border:1px solid #3554D1; color:#3554D1;
    background:#fff; border-radius:6px; display:flex; align-items:center; justify-content:center;
    cursor:pointer; transition:all .2s ease; padding:0; flex:0 0 auto;
}
.tour-sb__cbtn:hover{ background:#3554D1; color:#fff; }
.tour-sb__counter input{
    width:28px; text-align:center; border:0; background:transparent; font-size:15px;
    font-weight:600; color:#051036; -moz-appearance:textfield; padding:0;
}
.tour-sb__counter input::-webkit-outer-spin-button,
.tour-sb__counter input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
/* Cột giá bề rộng CỐ ĐỊNH (không co theo độ dài số) để nút −/+ của mọi hàng
   thẳng cột. */
.tour-sb__pax-price{ flex:0 0 106px; width:106px; text-align:right; font-size:15px; font-weight:700; color:#e63946; white-space:nowrap; }

/* Extra prices / buyer fees */
.tour-sb__extra{ background:#f7f9fc; border-radius:8px; padding:12px 14px; margin-bottom:12px; }
.tour-sb__extra-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
.tour-sb__extra-row:first-child{ margin-top:0; }

/* Tổng giá tour */
.tour-sb__total{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.tour-sb__total-label{ font-size:16px; font-weight:700; color:#051036; }
.tour-sb__total-price{ font-size:21px; font-weight:700; color:#e63946; }

/* Nút Tư vấn + Đặt tour */
.tour-sb__actions{ display:flex; gap:12px; margin-top:6px; }
.tour-sb__btn{
    flex:1 1 0; display:flex; align-items:center; justify-content:center; gap:8px;
    height:50px; border-radius:8px; font-size:15px; font-weight:600; cursor:pointer;
    transition:all .2s ease; text-align:center;
}
.tour-sb__btn--consult{ background:#fff; color:#3554D1; border:1px solid #3554D1; }
.tour-sb__btn--consult:hover{ background:#f4f6fd; }
.tour-sb__btn--book{ background:#3554D1; color:#fff !important; border:1px solid #3554D1; }
.tour-sb__btn--book:hover{ background:#051036; border-color:#051036; }
.tour-sb__btn.disabled{ opacity:.6; pointer-events:none; }

/* Khối "Chương trình" (file DOCX/PDF) dưới thẻ đặt tour */
.tour-sb-program{
    width:100%; background:#fff; border:1px solid #eef1f6; border-radius:12px;
    padding:18px 20px; margin-top:20px; box-shadow:0 4px 18px rgba(5,16,54,.05);
}
.tour-sb-program__title{ font-size:16px; font-weight:700; color:#051036; margin-bottom:12px; }
.tour-sb-program__file{
    display:inline-flex; align-items:center; gap:10px; border:1px solid #dfe3ec;
    border-radius:8px; padding:10px 16px; font-size:14px; font-weight:600; color:#2b579a;
    transition:all .2s ease;
}
.tour-sb-program__file i{ font-size:18px; color:#2b579a; }
.tour-sb-program__file:hover{ border-color:#2b579a; background:#f4f7fc; }

/* ===================================================================
   GALLERY chi tiết tour: ảnh lớn + hàng thumbnail (Swiper thumbs)
   =================================================================== */
.tourGallery{ position:relative; }
/* Theme dùng CSS Swiper cũ (.swiper-container). Swiper 8 dùng .swiper — tự thêm
   overflow:hidden để slide không lòi ra ngoài (thủ phạm thumbnail đè sidebar). */
.tourGallery .swiper{ overflow:hidden; position:relative; }
.tourGallery__main{ position:relative; border-radius:14px; overflow:hidden; }
.tourGallery__main .swiper{ border-radius:14px; }
.tourGallery__main .swiper-slide{ overflow:hidden; }
.tourGallery__main .swiper-slide img{
    display:block; width:100%; height:460px; object-fit:cover; border-radius:14px;
}
.tourGallery__link{ display:block; cursor:zoom-in; }
/* Mũi tên trên ảnh lớn */
.tourGallery__nav{
    position:absolute; top:50%; transform:translateY(-50%); z-index:5;
    width:48px; height:48px; border-radius:50%; border:0; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    background:rgba(255,255,255,.92); color:#3554D1;
    box-shadow:0 6px 20px rgba(5,16,54,.18); transition:all .2s ease;
}
.tourGallery__nav:hover{ background:#3554D1; color:#fff; }
.tourGallery__nav.-prev{ left:18px; }
.tourGallery__nav.-next{ right:18px; }
.tourGallery__nav.swiper-button-disabled{ opacity:0; pointer-events:none; }
/* Overlay nút video + xem tất cả ảnh */
.tourGallery__overlay{
    position:absolute; left:0; right:0; bottom:0; z-index:4;
    display:flex; align-items:flex-end; justify-content:flex-end; gap:10px;
    padding:20px;
}
.tourGallery__overlay .js-gallery:not(.button){ display:none; }
.tourGallery__overlay .bc-video-popup{
    display:inline-flex; align-items:center; color:#fff; font-weight:600;
    background:rgba(5,16,54,.35); border-radius:8px; padding:10px 16px; margin-right:auto;
}
.tourGallery__overlay .bc-video-popup:hover{ background:rgba(5,16,54,.6); }

/* Hàng thumbnail */
.tourGallery__thumbs{ position:relative; margin-top:14px; padding:0 40px; }
.tourGallery__thumbs .swiper-slide{ cursor:pointer; opacity:.55; transition:opacity .2s ease, border-color .2s ease; border:2px solid transparent; border-radius:10px; overflow:hidden; }
.tourGallery__thumbs .swiper-slide img{ display:block; width:100%; height:92px; object-fit:cover; }
.tourGallery__thumbs .swiper-slide:hover{ opacity:.85; }
.tourGallery__thumbs .swiper-slide-thumb-active{ opacity:1; border-color:#3554D1; }
/* Mũi tên hàng thumbnail */
.tourGallery__tnav{
    position:absolute; top:50%; transform:translateY(-50%); z-index:5;
    width:32px; height:32px; border-radius:50%; border:0; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    background:#3554D1; color:#fff;
    box-shadow:0 4px 12px rgba(5,16,54,.22); transition:all .2s ease;
}
.tourGallery__tnav:hover{ background:#051036; color:#fff; }
.tourGallery__tnav.-prev{ left:0; }
.tourGallery__tnav.-next{ right:0; }
.tourGallery__tnav.swiper-button-disabled{ opacity:.35; pointer-events:none; }

@media (max-width:767px){
    .tourGallery__main .swiper-slide img{ height:280px; }
    .tourGallery__thumbs .swiper-slide img{ height:64px; }
    .tourGallery__nav{ width:40px; height:40px; }
}

/* ===================================================================
   TRANG ĐĂNG NHẬP (/login) — bố cục 2 cột: trái = brand (gradient
   thương hiệu + logo + slogan), phải = form. Mobile: brand thu gọn
   lên trên, form xuống dưới. Màu theo VietnamTourist (#3554D1/#0b1733).
   =================================================================== */
/* Nền trang: đưa card ra giữa, chừa khoảng thở trên/dưới */
.bc-login-page{
    background: #eef2f8;
    padding: 56px 20px;
    display: flex;
    justify-content: center;
}
.bc-login-split{
    display: flex;
    width: 100%;
    max-width: 960px;
    min-height: 540px;
    margin: 0 auto;
    background: #fff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(5,16,54,.16);
}
/* Cột trái — brand */
.bc-login-split__aside{
    position: relative;
    flex: 0 0 45%;
    max-width: 45%;
    display: flex;
    align-items: center;
    background: linear-gradient(150deg, #0b1733 0%, #14275f 45%, #3554D1 100%);
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
.bc-login-split__aside::after{
    /* hoạ tiết vòng tròn mờ trang trí */
    content: "";
    position: absolute;
    right: -120px; top: -120px;
    width: 360px; height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle at center, rgba(255,255,255,.12), transparent 70%);
}
.bc-login-split__overlay{
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(5,16,54,.10), rgba(5,16,54,.35));
    z-index: 0;
}
.bc-login-split__aside-inner{
    position: relative;
    z-index: 1;
    padding: 48px 44px;
    max-width: 520px;
    margin: 0 auto;
    color: #fff;
}
.bc-login-split__logo{ max-height: 42px; width: auto; margin-bottom: 26px; }
.bc-login-split__title{
    color: #fff;
    font-size: 28px;
    line-height: 1.22;
    font-weight: 700;
    margin-bottom: 14px;
}
.bc-login-split__sub{
    color: #dbe3f4;
    font-size: 15px;
    line-height: 1.65;
    margin-bottom: 26px;
}
.bc-login-split__list{ list-style: none; margin: 0; padding: 0; }
.bc-login-split__list li{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 15px;
    color: #eaf0fb;
    margin-bottom: 14px;
}
.bc-login-split__list li i{ color: #7fa0ff; font-size: 18px; margin-top: 1px; }

/* Cột phải — form */
.bc-login-split__main{
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 32px;
}
/* Bên trong card lớn rồi nên form phẳng, không đổ bóng / bo góc riêng */
.bc-login-split__form{
    width: 100%;
    max-width: 380px;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
}
.bc-login-split__form .form-title{ margin-bottom: 4px; }

/* Tablet: cột brand hẹp lại */
@media (max-width: 1199px){
    .bc-login-split__aside{ flex-basis: 42%; max-width: 42%; }
    .bc-login-split__aside-inner{ padding: 48px 40px; }
    .bc-login-split__title{ font-size: 28px; }
}
/* Mobile: xếp dọc — brand thành banner gọn phía trên, form phía dưới */
@media (max-width: 991px){
    .bc-login-page{ padding: 24px 12px; }
    .bc-login-split{ flex-direction: column; min-height: 0; }
    .bc-login-split__aside{
        flex: none;
        max-width: 100%;
        padding: 0;
    }
    .bc-login-split__aside-inner{
        padding: 40px 24px 44px;
        max-width: 680px;
    }
    .bc-login-split__aside::after{ width: 220px; height: 220px; right: -80px; top: -80px; }
    .bc-login-split__logo{ margin-bottom: 22px; }
    .bc-login-split__title{ font-size: 24px; }
    .bc-login-split__sub{ font-size: 15px; margin-bottom: 20px; }
    /* trên mobile chỉ giữ 2 gạch đầu dòng cho gọn */
    .bc-login-split__list li:nth-child(n+3){ display: none; }
    .bc-login-split__main{ padding: 30px 20px 40px; }
    .bc-login-split__form{ max-width: 420px; }
}
@media (max-width: 575px){
    .bc-login-page{ padding: 0; }
    .bc-login-split{ border-radius: 0; box-shadow: none; }
    .bc-login-split__aside-inner{ padding: 34px 20px 40px; }
    .bc-login-split__main{ padding: 26px 18px 40px; }
}

/* ===== Thông tin chuyến bay (tour detail) ===== */
.tour-flight-card{ border:1px solid #e4e8f0; border-radius:12px; padding:20px 24px; background:#fff; box-shadow:0 2px 14px rgba(5,16,54,.05); }
.tour-flight-card .tf-leg{ padding:14px 0; }
.tour-flight-card .tf-leg + .tf-leg{ border-top:1px dashed #e4e8f0; }
.tf-leg__label{ font-size:15px; color:#051036; margin-bottom:12px; }
.tf-leg__label strong{ color:var(--color-blue-1,#3554D1); }
.tf-leg__body{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.tf-endpoint{ display:flex; flex-direction:column; min-width:64px; }
.tf-endpoint--right{ text-align:right; align-items:flex-end; }
.tf-time{ font-size:20px; font-weight:700; color:#051036; line-height:1.2; }
.tf-airport{ font-size:13px; color:#697488; letter-spacing:.5px; }
.tf-mid{ flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; position:relative; }
.tf-mid:before{ content:""; position:absolute; top:50%; left:8%; right:8%; border-top:2px dashed #d7deec; z-index:0; }
.tf-mid > *{ position:relative; z-index:1; background:#fff; padding:0 4px; }
.tf-air{ height:22px; width:auto; object-fit:contain; }
.tf-air-chip{ font-size:12px; font-weight:600; color:var(--color-blue-1,#3554D1); background:#eef2fb; padding:2px 8px; border-radius:20px; }
.tf-plane{ color:var(--color-blue-1,#3554D1); font-size:15px; }
.tf-code{ font-size:12px; color:#697488; }
@media (max-width:575px){
    .tour-flight-card{ padding:16px; }
    .tf-time{ font-size:17px; }
    .tf-leg__body{ gap:8px; }
}
/* Flight trong sidebar đặt tour (khung hẹp) */
.tour-sb-flight{ width:100%; }
.tour-sb-flight__title{ font-size:15px; font-weight:600; color:#051036; margin:0 0 10px; }
.tour-sb-flight .tour-flight-card{ padding:14px 16px; box-shadow:none; }
.tour-sb-flight .tf-time{ font-size:16px; }
.tour-sb-flight .tf-leg__body{ gap:8px; }
.tour-sb-flight .tf-airport{ font-size:12px; }
.tour-sb-flight .tf-air{ height:18px; }
/* FAQ tour: nội dung dùng xuống dòng thật (\n) không có <br> -> giữ xuống dòng */
.bc-faq-lists .accordion__content p{ white-space: pre-line; margin:0; }
/* Badge ngày khởi hành trên thẻ tour (giống saigontimes) — kéo ngang, click chọn ngày */
.tour-dep-dates{ display:flex; align-items:center; gap:8px; margin-top:6px; }
.tour-dep-dates__label{ flex:0 0 auto; font-size:12px; color:#697488; display:inline-flex; align-items:center; gap:4px; }
.tour-dep-dates__label i{ color:var(--color-blue-1,#3554D1); font-size:13px; }
.tour-dep-dates__scroll{ display:flex; gap:6px; overflow-x:auto; flex:1 1 auto; min-width:0; cursor:grab; scroll-behavior:smooth; -ms-overflow-style:none; scrollbar-width:none; padding-bottom:2px; }
.tour-dep-dates__scroll::-webkit-scrollbar{ display:none; }
.tour-dep-dates__scroll.is-dragging{ cursor:grabbing; scroll-behavior:auto; }
.tour-dep-dates__chip{ flex:0 0 auto; font-size:12px; font-weight:500; color:var(--color-blue-1,#3554D1); border:1px solid #c7d2f7; background:#eef2fb; border-radius:6px; padding:1px 8px; line-height:1.7; white-space:nowrap; user-select:none; text-decoration:none; transition:all .15s; }
a.tour-dep-dates__chip:hover{ background:var(--color-blue-1,#3554D1); color:#fff; border-color:var(--color-blue-1,#3554D1); }
/* Khi đang KÉO: tắt hover để chip không nhấp nháy xanh qua lại */
.tour-dep-dates__scroll.is-dragging a.tour-dep-dates__chip,
.tour-dep-dates__scroll.is-dragging a.tour-dep-dates__chip:hover{ background:#eef2fb !important; color:var(--color-blue-1,#3554D1) !important; border-color:#c7d2f7 !important; }
/* Khi đăng nhập (mọi role có admin-bar): thanh admin-bar (sticky top) không được đè header.
   Đẩy CẢ topbar (.header-banner absolute) LẪN navbar (.header fixed) xuống dưới thanh admin. */
.has-adminbar .header-banner{ top: var(--adminbar-h, 48px) !important; }
.has-adminbar .header{ top: var(--adminbar-h, 48px) !important; }

/* ===== Content tour: bố cục & xuống dòng gọn đẹp ===== */
.bc_detail_tour .content-text{ line-height:1.75; color:#3b4356; }
.bc_detail_tour .content-text p{ margin:0 0 12px; }
.bc_detail_tour .content-text h1,
.bc_detail_tour .content-text h2,
.bc_detail_tour .content-text h3,
.bc_detail_tour .content-text h4{ margin:22px 0 10px; line-height:1.35; color:#051036; font-weight:700; }
.bc_detail_tour .content-text h1{ font-size:22px; }
.bc_detail_tour .content-text h2{ font-size:19px; }
.bc_detail_tour .content-text h3{ font-size:17px; }
.bc_detail_tour .content-text ul,
.bc_detail_tour .content-text ol{ margin:8px 0 16px; padding-left:22px; }
.bc_detail_tour .content-text li{ margin:4px 0; padding-left:2px; }
/* FIX bullet lệch: <p> trong <li> mất margin -> chữ sát bullet */
.bc_detail_tour .content-text li > p{ margin:0; display:inline; }
.bc_detail_tour .content-text li > p + p{ display:block; margin-top:4px; }
.bc_detail_tour .content-text ul li{ list-style:disc; }
.bc_detail_tour .content-text ul li::marker{ color:var(--color-blue-1,#3554D1); }
.bc_detail_tour .content-text img{ max-width:100%; height:auto; border-radius:8px; margin:8px 0; }
.bc_detail_tour .content-text a{ color:var(--color-blue-1,#3554D1); text-decoration:underline; }
.bc_detail_tour .content-text > *:first-child{ margin-top:0; }