@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&family=Poppins:wght@500;600;700;800&family=Pacifico&display=swap");

/* Green theme - homepage & booking (header, footer, accents) */
/* Typography: Poppins = tiêu đề; Be Vietnam Pro = body */
.page-home,
.page-booking,
body.page-home,
body.page-booking {
    font-family: "Be Vietnam Pro", "Segoe UI", Tahoma, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.01em;
}

body.page-home p,
body.page-booking p,
body.page-home label,
body.page-booking label,
body.page-home input,
body.page-booking input,
body.page-home select,
body.page-booking select,
body.page-home button,
body.page-booking button,
body.page-home a,
body.page-booking a,
body.page-home li,
body.page-booking li,
body.page-home span,
body.page-booking span,
body.page-home td,
body.page-booking td,
body.page-home th,
body.page-booking th {
    font-family: "Be Vietnam Pro", "Segoe UI", Tahoma, sans-serif !important;
}

body.page-home h1,
body.page-home h2,
body.page-home h3,
body.page-home h4,
body.page-home h5,
body.page-home h6,
body.page-booking h1,
body.page-booking h2,
body.page-booking h3,
body.page-booking h4,
body.page-booking h5,
body.page-booking h6,
body.page-home h1 a,
body.page-home h2 a,
body.page-home h3 a,
body.page-home h4 a,
body.page-home h5 a,
body.page-home h6 a,
body.page-booking h1 a,
body.page-booking h2 a,
body.page-booking h3 a,
body.page-booking h4 a,
body.page-booking h5 a,
body.page-booking h6 a,
.page-home .ck-section-title,
.page-booking .ck-section-title,
.page-home .ck-feature h3,
.page-home .ck-about__content h2,
.page-home .ck-explore__promo-title,
.page-home .ck-footer__col h3,
.page-booking .ck-footer__col h3 {
    font-family: "Poppins", "Segoe UI", Tahoma, sans-serif !important;
}

/* Tiêu đề bài / card tiếng Việt: Poppins ExtraBold làm dấu bị dính */
body.page-home .ck-card__body h3,
body.page-home .ck-card__body h3 a,
body.page-home .ck-news-card__title,
body.page-home .ck-news-card__title a,
body.page-home .ck-news-detail__title,
body.page-home .ck-news-detail__content h1,
body.page-home .ck-news-detail__content h2,
body.page-home .ck-news-detail__content h3,
body.page-home .ck-news-detail__content h4,
body.page-home .ck-news-detail__content strong,
body.page-home .ck-news-detail__content b {
    font-family: "Be Vietnam Pro", "Segoe UI", Tahoma, sans-serif !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    letter-spacing: 0.01em !important;
    font-synthesis: none;
}

.page-home .theme,
.page-booking .theme {
    color: #00910D !important;
}

.page-home .theme1,
.page-booking .theme1 {
    color: #007a0b !important;
}

.page-home .bg-theme,
.page-booking .bg-theme {
    background: #00910D !important;
}

.page-home .bg-theme1,
.page-booking .bg-theme1 {
    background: #007a0b !important;
}

.page-home .bg-theme2,
.page-booking .bg-theme2 {
    background: #00b814 !important;
}

.page-home .nir-btn,
.page-home a.nir-btn,
.page-home input.nir-btn,
.page-booking .nir-btn,
.page-booking a.nir-btn,
.page-booking input.nir-btn {
    background: #00910D !important;
}

.page-home .nir-btn::before,
.page-home a.nir-btn::before,
.page-home input.nir-btn::before,
.page-booking .nir-btn::before,
.page-booking a.nir-btn::before,
.page-booking input.nir-btn::before {
    background: #007a0b !important;
}

.page-home .header-content.bg-theme,
.page-booking .header-content.bg-theme {
    background: #00910D !important;
}

.page-home .header_menu .navbar.navbar-default .nav.navbar-nav li a:hover,
.page-home .header_menu .navbar.navbar-default .nav.navbar-nav li.active > a,
.page-booking .header_menu .navbar.navbar-default .nav.navbar-nav li a:hover,
.page-booking .header_menu .navbar.navbar-default .nav.navbar-nav li.active > a {
    color: #00910D !important;
}

.page-home .banner-slider .slick-prev,
.page-home .banner-slider .slick-next,
.page-home .image-slider .slick-prev,
.page-home .image-slider .slick-next {
    background: #00910D !important;
}

.page-home .trend-content h4 a:hover,
.page-home .trend-item a:hover,
.page-home .single-content a:hover {
    color: #00910D !important;
}

.page-home .pagination-main .pagination li.active a,
.page-home .pagination-main .pagination li a:hover,
.page-home .pagination-main .pagination li a:focus,
.page-home .pagination li.active a,
.page-home .pagination li a:hover {
    background: #00910D !important;
    border-color: #00910D !important;
    color: #fff !important;
}

.page-home .gallery-content ul li a {
    background: #00910D !important;
}

.page-home .gallery-item:hover .overlay {
    background: rgba(0, 145, 13, 0.75) !important;
}

.page-home .bgyallow-1 {
    background: #00910D !important;
}

.page-home .sidebar-widget-title h5 span.bgyallow-1,
.page-home .section-title h2 .theme {
    color: #00910D !important;
}

.page-home #back-to-top a,
.page-booking #back-to-top a {
    background: #00910D !important;
}

.page-home .section-title::before {
    border-color: #00910D !important;
}

.page-home .accrodion-grp .accrodion.active .accrodion-title {
    background: #00910D !important;
    border-color: #00910D !important;
}

.page-home .footer-social a:hover,
.page-booking .footer-social a:hover {
    background: #007a0b !important;
    color: #fff !important;
}

.page-home footer,
.page-booking footer {
    background: #00910D !important;
    background-image: none !important;
}

.page-home footer .footer-copyright,
.page-booking footer .footer-copyright {
    background: #007a0b;
}

.page-home footer .copyright-inner,
.page-booking footer .copyright-inner {
    background: rgba(255, 255, 255, 0.08) !important;
}

.page-home footer .footer-links a:hover,
.page-booking footer .footer-links a:hover {
    color: #fff !important;
}

/* Booking flow content */
.page-booking .page-title-wrap.bgredblue,
.page-booking .bgredblue {
    background: #00910D !important;
}

.page-booking .page-title-wrap ul.breadcrumb,
.page-title-wrap.bgredblue ul.breadcrumb {
    background-color: #C8E6C9 !important;
    border-radius: 4px;
    margin-bottom: 0;
    padding: 10px 16px;
}

.page-booking .page-title-wrap ul.breadcrumb li,
.page-booking .page-title-wrap ul.breadcrumb li a,
.page-booking .page-title-wrap ul.breadcrumb li.active a,
.page-booking ul.breadcrumb li,
.page-booking ul.breadcrumb li a,
.page-booking ul.breadcrumb li.active a,
.page-booking .breadcrumb > li,
.page-booking .breadcrumb > li a,
.page-booking .breadcrumb > li.active > a {
    color: #1B5E20 !important;
    text-decoration: none !important;
    font-weight: 600;
}

.page-booking .page-title-wrap ul.breadcrumb li + li:before,
.page-booking ul.breadcrumb li + li:before {
    color: #2E7D32 !important;
}

.page-booking .booking-filter-panel {
    background: #00910D !important;
}

.page-booking .select-booking .nav-link.active,
.page-booking .select-booking button.nav-link.active {
    background-color: #007a0b !important;
    border-color: #006608 !important;
    color: #fff !important;
}

.page-booking .table-header {
    background-color: #00910D !important;
}

.page-booking .btn-success,
.page-booking a.btn-success,
.page-booking .btn-info {
    background: #00910D !important;
    border-color: #007a0b !important;
}

.page-booking .panel-primary {
    border-color: #00910D;
}

.page-booking .panel-primary > .panel-heading {
    background-color: #00910D !important;
    border-color: #00910D !important;
    color: #fff !important;
}

/* Headline mục: chỉ chữ xanh đậm, không nền */
.page-booking .booking-headline,
.page-booking h6.booking-headline,
.page-booking .text-on-pannel.text-primary,
.page-booking .text-on-pannel,
.page-booking .panel-body > h6.text-primary {
    background: none !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #00910D !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
    display: block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    line-height: 1.3 !important;
}

.page-booking .booking-headline strong,
.page-booking .text-on-pannel.text-primary strong,
.page-booking .text-on-pannel strong,
.page-booking .panel-body > h6.text-primary strong {
    background: none !important;
    background-color: transparent !important;
    color: #00910D !important;
    font-size: inherit !important;
    font-weight: 700 !important;
    padding: 0 !important;
}

.page-booking .nav-tabs > li.active > a,
.page-booking .nav-tabs > li.active > a:hover,
.page-booking .nav-tabs > li.active > a:focus {
    color: #00910D !important;
}

.page-booking .required-star {
    color: #d9534f;
}

/* Booking schedule table — tránh xung đột Bootstrap .col */
.page-booking .responsive-table {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}

.page-booking .responsive-table .table-header,
.page-booking .responsive-table .table-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 8px;
    padding: 10px 8px !important;
    gap: 4px;
}

.page-booking .responsive-table .col {
    float: none !important;
    position: relative !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    padding: 0 4px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.page-booking .responsive-table .col-4 {
    flex: 1.4 1 0 !important;
}

.page-booking .responsive-table .col-3 {
    flex: 1 1 0 !important;
}

.page-booking .responsive-table .col-2 {
    flex: 0 0 44px !important;
    max-width: 44px !important;
    text-align: center;
}

.page-booking .responsive-table .col-10,
.page-booking .responsive-table .col-12,
.page-booking .responsive-table .col-8 {
    flex: 1 1 100% !important;
}

.page-booking .responsive-table .col p {
    margin: 0 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: anywhere;
    font-size: 14px;
}

.page-booking .list-timer.round-booking {
    overflow: hidden;
}

.page-booking .select-booking-form .booking-filter-panel > [class*="col-"] {
    margin-bottom: 10px;
}

/* ========== Mobile layout fixes ========== */
@media (max-width: 767px) {
    /* Breadcrumb: cuộn ngang 1 hàng */
    .page-booking .page-title-wrap {
        margin-top: 12px !important;
        padding: 8px 0 !important;
    }

    .page-booking .page-title-wrap ul.breadcrumb {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        align-items: center !important;
        gap: 0;
        padding: 8px 10px !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }

    .page-booking .page-title-wrap ul.breadcrumb li,
    .page-booking .page-title-wrap ul.breadcrumb li a {
        font-size: 11px !important;
        font-weight: 600 !important;
        white-space: nowrap !important;
        flex-shrink: 0;
    }

    /* Form đặt vé */
    .page-booking .select-booking-form .container,
    .page-booking .select-booking-form > .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .page-booking .select-booking-form .col-lg-4,
    .page-booking .select-booking-form .col-lg-8 {
        width: 100% !important;
        float: none !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .page-booking .booking-filter-panel {
        padding: 16px 12px 20px !important;
    }

    .page-booking .booking-filter-panel > [class*="col-"] {
        width: 100% !important;
        float: none !important;
        max-width: 100% !important;
        margin-bottom: 12px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .page-booking .select-booking .nav-tabs {
        display: flex !important;
        justify-content: center;
        gap: 8px;
        flex-wrap: wrap;
    }

    .page-booking .select-booking .nav-tabs .nav-link {
        float: none !important;
        max-width: none !important;
        width: auto !important;
        min-width: 120px;
    }

    /* Lịch trình: dạng thẻ trên mobile, không đè cột */
    .page-booking .responsive-table .table-col-labels {
        display: none !important;
    }

    .page-booking .responsive-table .table-header {
        display: block !important;
        background: transparent !important;
        color: #00910D !important;
        padding: 8px 4px 4px !important;
        margin-bottom: 4px !important;
        box-shadow: none !important;
    }

    .page-booking .responsive-table .table-header .col {
        display: block !important;
        width: 100% !important;
        flex: none !important;
        max-width: 100% !important;
        text-align: left !important;
        color: #00910D !important;
        font-weight: 700 !important;
        font-size: 15px !important;
        letter-spacing: 0.5px !important;
    }

    .page-booking .responsive-table .table-row {
        display: block !important;
        text-align: left !important;
        padding: 12px !important;
        margin-bottom: 10px !important;
        background: #fff;
        border: 1px solid #e5e5e5;
        border-radius: 6px;
        box-shadow: 0 1px 4px rgba(0,0,0,.06);
    }

    .page-booking .responsive-table .table-row .col {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        padding: 6px 0 !important;
        border-bottom: 1px dashed #eee;
        text-align: left !important;
    }

    .page-booking .responsive-table .table-row .col:last-child {
        border-bottom: none;
    }

    .page-booking .responsive-table .table-row .col::before {
        content: attr(data-label);
        font-weight: 700;
        color: #00910D;
        margin-right: 12px;
        flex: 0 0 90px;
        text-align: left;
        font-size: 12px;
        text-transform: none;
    }

    .page-booking .responsive-table .table-row .col[data-label='Point']::before { content: "Lịch trình"; }
    .page-booking .responsive-table .table-row .col[data-label='FromTime']::before { content: "Ngày"; }
    .page-booking .responsive-table .table-row .col[data-label='ToTime']::before { content: "Giờ đi"; }
    .page-booking .responsive-table .table-row .col[data-label='Action']::before { content: "Chọn"; }
    .page-booking .responsive-table .table-row .col[data-label='Empty']::before { content: ""; flex: 0; }

    .page-booking .responsive-table .table-row .col p {
        flex: 1;
        text-align: right;
        font-size: 14px !important;
        line-height: 1.4 !important;
        white-space: normal !important;
        word-break: break-word !important;
    }

    .page-booking .responsive-table .table-header + .table-row,
    .page-booking .responsive-table > .table-row:first-child {
        /* header row in Index (Lịch Trình / Ngày…) — hide if no data-label */
    }

    .page-booking .responsive-table .table-row .col:not([data-label]) {
        display: none !important;
    }

    .page-booking .categories-section .btn-success,
    .page-booking .note-color .btn-success {
        width: 100% !important;
        max-width: 100% !important;
    }

    .page-booking .categories-section .note-col[style] {
        width: 100% !important;
    }

    /* Map ghế: cuộn ngang, không co méo */
    .page-booking .list-seat-scroll {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 auto;
    }

    .page-booking .list-seat {
        max-width: none !important;
    }

    .page-booking .feature-section {
        background-attachment: scroll !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
        overflow-x: hidden;
    }

    /* Khối dưới map: xếp dọc 1 cột, hết đè */
    .page-booking .categories-section > .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .page-booking .categories-section .seat-meta-row,
    .page-booking .categories-section > .container {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .page-booking .categories-section .seat-meta-row > [class*="col-"],
    .page-booking .categories-section > .container > [class*="col-"] {
        width: 100% !important;
        float: none !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        clear: both !important;
        flex: none !important;
    }

    .page-booking .categories-section h5 {
        margin: 0 0 8px 0 !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        color: #00910D !important;
    }

    .page-booking .note-color {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px 8px !important;
    }

    .page-booking .note-color .note-label,
    .page-booking .note-color .note-col p {
        font-size: 12px !important;
        line-height: 1.35 !important;
    }

    .page-booking #total_ticket,
    .page-booking #total_ticketR {
        letter-spacing: 0.5px !important;
        word-break: break-word !important;
        white-space: normal !important;
    }

    .page-booking #clockdiv > div {
        display: flex !important;
        align-items: baseline;
        gap: 2px;
        float: none !important;
        clear: both;
    }

    .page-booking #clockdiv .minutes,
    .page-booking #clockdiv .seconds,
    .page-booking #clockdiv .smalltext {
        float: none !important;
    }

    .page-booking .categories-section .btn-success,
    .page-booking .note-color .btn-success,
    .page-booking .note-col .btn-success {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        text-align: center;
        margin: 0 !important;
    }

    /* Form hành khách: 1 cột */
    .page-booking .FormCusInfor {
        overflow: hidden;
    }

    .page-booking .FormCusInfor > [class*="col-"] {
        width: 100% !important;
        float: none !important;
        max-width: 100% !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 4px;
    }

    .page-booking .FormCusInfor .form-control,
    .page-booking .FormOtoInfor .form-control,
    .page-booking input.form-control,
    .page-booking select.form-control {
        font-size: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .page-booking .main-wrap,
    .page-booking .col-md-9,
    .page-booking .col-sm-8,
    .page-booking .col-md-3,
    .page-booking .col-sm-4 {
        width: 100% !important;
        float: none !important;
        max-width: 100% !important;
    }

    .page-booking .container[style],
    .page-booking .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .page-booking .panel-body {
        padding: 12px !important;
        overflow: hidden;
    }

    .page-booking .panel {
        margin-bottom: 12px;
    }

    .page-booking a.btn-info[data-toggle="collapse"] {
        font-size: 15px !important;
        height: auto !important;
        line-height: 1.3 !important;
        padding: 10px 12px !important;
        white-space: normal !important;
    }

    .page-booking .btn-success,
    .page-booking a.btn-success {
        width: 100% !important;
        box-sizing: border-box;
    }

    .page-booking .listing-section {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Policy pages */
    .page-home .policy-page-content {
        padding: 0 4px;
        font-size: 14px;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    .page-home .policy-page-content h2 {
        font-size: 20px !important;
        line-height: 1.3;
    }

    .page-home .single-content,
    .page-home .col-lg-8,
    .page-home .col-lg-10 {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* Header mobile */
    .page-home .header_menu .navbar-collapse1,
    .page-booking .header_menu .navbar-collapse1,
    .page-home .register-login,
    .page-booking .register-login {
        display: none !important;
    }

    .page-home .navbar-flex,
    .page-booking .navbar-flex {
        flex-wrap: nowrap !important;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

    .page-home .navbar-brand img,
    .page-booking .navbar-brand img {
        max-height: 48px !important;
        width: auto !important;
    }

    .page-home #slicknav-mobile,
    .page-booking #slicknav-mobile {
        margin-left: auto;
    }

    /* Footer mobile */
    .page-home .footer-about .footer-logo,
    .page-booking .footer-about .footer-logo {
        transform: none !important;
        max-height: 90px !important;
    }

    .page-home .footer-social,
    .page-booking .footer-social {
        flex-wrap: wrap !important;
    }

    .page-home footer .col-lg-3,
    .page-booking footer .col-lg-3 {
        width: 100% !important;
        float: none !important;
        max-width: 100% !important;
        margin-bottom: 20px !important;
    }

    .page-home footer .footer-links ul li,
    .page-booking footer .footer-links ul li {
        word-break: break-word;
        line-height: 1.5;
    }
}

/* SweetModal: hộp trắng, chữ tối — không nền xanh cả hộp */
.sweet-modal-overlay.dark .sweet-modal-box,
.sweet-modal-overlay .sweet-modal-box {
    background: #fff !important;
    color: #222 !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18) !important;
}

.sweet-modal-overlay.dark .sweet-modal-box .sweet-modal-title-wrap,
.sweet-modal-overlay .sweet-modal-box .sweet-modal-title-wrap {
    border-color: #eee !important;
    box-shadow: none !important;
    background: #fff !important;
}

.sweet-modal-overlay.dark .sweet-modal-title,
.sweet-modal-overlay.dark .sweet-modal-title h2,
.sweet-modal-overlay.dark .sweet-modal-content,
.sweet-modal-overlay .sweet-modal-title,
.sweet-modal-overlay .sweet-modal-title h2,
.sweet-modal-overlay .sweet-modal-content {
    color: #222 !important;
}

.sweet-modal-overlay.dark .sweet-modal-box .sweet-modal-buttons,
.sweet-modal-overlay .sweet-modal-box .sweet-modal-buttons {
    border-color: #eee !important;
    box-shadow: none !important;
    background: #fff !important;
}

.sweet-modal-overlay.dark .sweet-modal-close a.sweet-modal-close-link,
.sweet-modal-overlay .sweet-modal-close a.sweet-modal-close-link {
    background-color: #f3f3f3 !important;
}

.sweet-modal-overlay.dark .sweet-modal-close a.sweet-modal-close-link:hover,
.sweet-modal-overlay .sweet-modal-close a.sweet-modal-close-link:hover {
    background-color: #e8e8e8 !important;
}

.sweet-modal-buttons button.redB,
.redB.button {
    background: #00910D !important;
    border-color: #007a0b !important;
    color: #fff !important;
    border-radius: 6px !important;
    min-width: 88px;
}

.sweet-modal-buttons button.redB:hover,
.redB.button:hover {
    background: #00a810 !important;
}

/* ===== Home hero banner (full artwork image) ===== */
body.page-home .home-hero {
    margin-bottom: 0;
}

body.page-home .home-hero-img,
body.page-home .ck-hero__img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: unset !important;
    object-position: center top !important;
    display: block;
}

body.page-home .home-search-bar {
    position: relative;
    z-index: 50;
    margin-top: -48px;
    padding-bottom: 8px;
}

body.page-home .home-search-bar .form-content {
    box-shadow: none;
    border: 0 !important;
    background: #ffffff !important;
    opacity: 1 !important;
}

body.page-home .home-price-section {
    padding-top: 40px;
}

body.page-home .home-price-img {
    max-width: 920px;
    margin: 0 auto;
}

@media (max-width: 767px) {
    body.page-home .home-hero-img,
    body.page-home .ck-hero__img {
        height: auto !important;
        object-fit: unset !important;
    }

    body.page-home .home-search-bar {
        margin-top: -24px;
    }

    body.page-home .home-search-bar .form-content {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

body.page-home .home-price-img {
    max-width: 920px;
    margin: 0 auto;
}

/* ========== Chấn Kha Luxury redesign (homepage + chrome) ========== */
:root {
    --ck-green: #00910D;
    --ck-green-dark: #007a0b;
    --ck-green-deep: #006308;
    --ck-red: #e31c23;
    --ck-red-dark: #c4161c;
    --ck-text: #222;
    --ck-muted: #666;
    --ck-line: #e8eee8;
    --ck-font-body: "Be Vietnam Pro", "Segoe UI", Tahoma, sans-serif;
    --ck-font-heading: "Poppins", "Segoe UI", Tahoma, sans-serif;
    --ck-header-h: 148px;
}

body {
    font-family: var(--ck-font-body) !important;
    color: var(--ck-text);
    -webkit-font-smoothing: antialiased;
    padding-top: var(--ck-header-h);
}

body.page-home h1,
body.page-home h2,
body.page-home h3,
body.page-home h4,
body.page-home h5,
body.page-home h6,
body.page-booking h1,
body.page-booking h2,
body.page-booking h3,
body.page-booking h4,
body.page-booking h5,
body.page-booking h6 {
    font-family: var(--ck-font-heading) !important;
}

#back-to-top {
    display: none !important;
}

/* ---- Header ---- */
.ck-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1040;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.ck-header__top {
    background: #fff;
    border-bottom: 1px solid var(--ck-line);
    position: relative;
}

.ck-header__top-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 88px;
    padding-top: 10px;
    padding-bottom: 10px;
}

/* Header/nav full width — không bị kẹp .container 1170px */
.ck-header .container {
    width: 100% !important;
    max-width: none !important;
    padding-left: 28px;
    padding-right: 28px;
}

.ck-header__lang {
    flex: 0 0 auto;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.04em;
}

.ck-header__lang a {
    color: #555;
    text-decoration: none;
}

.ck-header__lang a.is-active,
.ck-header__lang a:hover {
    color: var(--ck-green);
}

.ck-header__lang-sep {
    margin: 0 6px;
    color: #bbb;
}

.ck-header__logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
}

.ck-header__logo img {
    height: 72px;
    width: auto;
    display: block;
}

.ck-header__actions {
    flex: 0 0 auto;
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 12px;
}

.ck-header__search {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

.ck-header__search-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 44px;
    min-width: 168px;
    padding: 0 22px;
    margin: 0;
    background: #00910D;
    border-radius: 999px;
    cursor: text;
    box-sizing: border-box;
}

.ck-header__search-btn > i.fa-search {
    color: #fff;
    font-size: 15px;
    flex: 0 0 auto;
    pointer-events: none;
}

.ck-header__search-btn input {
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color: #ffffff;
    padding: 0;
    margin: 0;
    height: 44px;
    width: 78px;
    font-size: 15px;
    font-weight: 600;
    font-family: var(--ck-font-body);
    box-shadow: none !important;
}

.ck-header__search-btn input::placeholder {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    font-weight: 600;
}

.ck-header__search-btn input::-webkit-input-placeholder {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
}

.ck-header__search-btn input::-moz-placeholder {
    color: #ffffff !important;
    opacity: 1 !important;
}

.ck-header__search-btn input:-ms-input-placeholder {
    color: #ffffff !important;
}

.ck-header__search-btn input::-webkit-search-decoration,
.ck-header__search-btn input::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

/* Chrome autofill override */
.ck-header__search-btn input:-webkit-autofill,
.ck-header__search-btn input:-webkit-autofill:hover,
.ck-header__search-btn input:-webkit-autofill:focus {
    -webkit-text-fill-color: #ffffff !important;
    transition: background-color 99999s ease-in-out 0s;
}

.ck-header__book {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #e31c23;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.03em;
    padding: 0 20px;
    height: 44px;
    border-radius: 999px;
    white-space: nowrap;
    transition: color .2s ease;
    box-sizing: border-box;
}

.ck-header__book-ico {
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    display: block;
    background-color: #fff;
    -webkit-mask-image: url("/Content/images/icons/ticket.png?v=3");
    mask-image: url("/Content/images/icons/ticket.png?v=3");
    -webkit-mask-mode: luminance;
    mask-mode: luminance;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    transition: background-color .2s ease;
}

.ck-header__book:hover,
.ck-header__book:focus,
.ck-header__book:active,
.ck-header__book.is-active {
    background: #e31c23;
    color: #ff8c00 !important;
}

.ck-header__book:hover .ck-header__book-ico,
.ck-header__book:focus .ck-header__book-ico,
.ck-header__book:active .ck-header__book-ico,
.ck-header__book.is-active .ck-header__book-ico {
    background-color: #ff8c00;
}

.ck-header__nav {
    background: var(--ck-green);
}

.ck-header__nav .container {
    position: relative;
}

.ck-navbar.navbar,
.ck-navbar.navbar-default,
.ck-header__nav .navbar.navbar-default {
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    min-height: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.ck-header__nav .ck-nav.nav.navbar-nav,
.ck-header__nav ul#responsive-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    background: transparent !important;
}

.ck-header__nav .ck-nav > li,
.ck-header__nav .navbar-default .navbar-nav > li,
.ck-header__nav .navbar-default .navbar-nav > li.active,
.ck-header__nav .navbar-nav > li,
.ck-header__nav .navbar-nav > li.active {
    float: none !important;
    display: block !important;
    flex: 1 1 0 !important;
    text-align: center !important;
    width: auto !important;
    margin: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
}

.ck-header__nav .ck-nav > li > a,
.ck-header__nav .navbar-default .navbar-nav > li > a,
.ck-header__nav .navbar-default .navbar-nav > li a:hover,
.ck-header__nav .navbar-default .navbar-nav > li.active > a,
.ck-header__nav .navbar-default .navbar-nav > li.active a:hover,
.ck-header__nav .navbar-nav > li > a,
.ck-header__nav .navbar-nav > li.active > a {
    color: #fff !important;
    text-transform: uppercase;
    font-family: var(--ck-font-heading) !important;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.04em;
    padding: 14px 8px !important;
    line-height: 1.35 !important;
    background: transparent !important;
    background-color: transparent !important;
    position: relative;
    display: block !important;
    text-align: center !important;
}

.ck-header__nav .ck-nav > li.active > a,
.ck-header__nav .ck-nav > li > a:hover,
.ck-header__nav .ck-nav > li > a:focus {
    color: #fff !important;
    background: rgba(0, 0, 0, 0.08) !important;
}

.ck-header__nav .ck-nav > li.active > a::after {
    content: "";
    position: absolute;
    left: 18%;
    right: 18%;
    bottom: 8px;
    height: 2px;
    background: #fff;
}

/* Desktop: ẩn nút hamburger (chỉ hiện ≤1099px) */
.ck-header__mobile {
    display: none;
}

.ck-header__mobile .slicknav_btn {
    background: var(--ck-green) !important;
    margin: 0;
}

.ck-header__mobile .slicknav_menutxt {
    display: none;
}

/* Menu mobile: nền sáng, chữ thường (không IN HOA trên nền xanh) */
.ck-header .slicknav_nav,
.ck-header .slicknav_nav ul,
.ck-header .slicknav_nav ul li {
    background: #f6f6f6 !important;
    color: #222 !important;
}

.ck-header .slicknav_nav {
    padding: 4px 0 6px;
    border-top: 1px solid #ececec;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    overflow-y: visible !important;
    position: static !important;
}

.ck-header .slicknav_nav a,
.ck-header .slicknav_nav .slicknav_row,
.ck-header .slicknav_nav .slicknav_item {
    color: #222 !important;
    background: transparent !important;
    font-family: "Be Vietnam Pro", "Segoe UI", Tahoma, sans-serif !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-align: left !important;
    border-bottom: none !important;
    padding: 13px 20px !important;
}

.ck-header .slicknav_nav a:hover,
.ck-header .slicknav_nav a:focus,
.ck-header .slicknav_nav .slicknav_row:hover {
    color: #00910D !important;
    background: transparent !important;
}

.ck-header .slicknav_nav li.active > a,
.ck-header .slicknav_nav .active > a {
    color: #00910D !important;
    background: transparent !important;
    font-weight: 600 !important;
}

.ck-header .slicknav_nav .slicknav_arrow {
    color: #222 !important;
}

/* ---- Floating contacts ---- */
.ck-float {
    position: fixed;
    right: 16px;
    bottom: 24px;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ck-float__btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
    font-size: 22px;
    transition: transform .2s ease;
}

.ck-float__btn:hover {
    transform: translateY(-2px);
}

.ck-float__btn--messenger { background: #0084ff; }
.ck-float__btn--phone { background: var(--ck-green); }
.ck-float__btn--zalo {
    background: #0068ff;
    overflow: hidden;
    padding: 0;
}
.ck-float__btn--zalo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ck-float__btn--top { background: var(--ck-green-dark); font-size: 18px; }

/* ---- Footer ---- */
.ck-footer {
    background: var(--ck-green) !important;
    color: #fff;
    padding: 48px 0 18px;
    margin-top: 0;
}

.ck-footer .container {
    width: 100% !important;
    max-width: 1360px !important;
    padding-left: 32px;
    padding-right: 32px;
}

.ck-footer a { color: rgba(255, 255, 255, 0.88); }
.ck-footer a:hover { color: #fff; text-decoration: underline; }

.ck-footer__cols {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    --bs-gutter-x: 0;
    margin-left: 0;
    margin-right: 0;
}

.ck-footer__cols > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
    float: none !important;
}

/* Desktop: 4 cột thẳng hàng (logo | điều kiện | thông tin | liên hệ) */
@media (min-width: 992px) {
    .ck-footer__cols {
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 0 28px;
    }

    .ck-footer__cols > [class*="col-lg-"] {
        flex: 1 1 0;
        max-width: none !important;
        width: auto !important;
        min-width: 0;
    }

    .ck-footer__cols > [class*="col-lg-"]:first-child {
        flex: 0 0 220px;
        max-width: 220px !important;
    }

    .ck-footer__col {
        margin-bottom: 0;
    }

    .ck-footer__col h3 {
        margin-top: 0;
        min-height: 2.4em;
    }
}

/* Tablet + dưới desktop: xếp dọc, 3 mục nội dung cùng căn trái */
@media (max-width: 991px) {
    .ck-footer {
        padding: 14px 0 12px;
    }

    .ck-footer .container {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .ck-footer__cols {
        display: block !important;
        width: 100%;
        margin: 0 !important;
    }

    .ck-footer__cols > [class*="col-"],
    .ck-footer__cols > [class*="col-"]:first-child,
    .ck-footer__cols > [class*="col-"]:not(:first-child),
    .ck-footer__cols > .col-lg-3,
    .ck-footer__cols > .col-md-6,
    .ck-footer__cols > .col-sm-12 {
        display: block !important;
        float: none !important;
        clear: both !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        margin: 0 0 16px 0 !important;
        padding: 0 !important;
        left: auto !important;
        right: auto !important;
        text-align: left !important;
    }

    .ck-footer__cols > [class*="col-"]:first-child {
        margin-bottom: 10px !important;
    }

    .ck-footer__col--brand {
        align-items: center !important;
        text-align: center !important;
        width: 100% !important;
        margin-bottom: 8px !important;
    }

    .ck-footer__logo {
        margin: 0 auto 18px;
        display: block;
        width: auto;
        height: auto;
        overflow: visible;
    }

    .ck-footer__logo img {
        width: 140px !important;
        max-width: 140px !important;
        height: auto !important;
        margin: 0;
    }

    .ck-footer__social-label {
        text-align: center !important;
        width: 100%;
        margin: 0 0 14px;
        font-size: 12px;
    }

    .ck-footer__social {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100%;
        margin: 0 auto;
        gap: 16px;
    }

    .ck-footer__social a {
        width: 58px !important;
        height: 58px !important;
        font-size: 24px !important;
    }

    .ck-footer__social a img {
        width: 28px !important;
        height: 28px !important;
    }

    .ck-footer__col,
    .ck-footer__col:not(.ck-footer__col--brand) {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 20px 0 !important;
        padding: 0 !important;
        text-align: left !important;
    }

    .ck-footer__col.ck-footer__col--brand {
        margin-bottom: 8px !important;
    }

    .ck-footer__col h3,
    .ck-footer__col:not(.ck-footer__col--brand) h3,
    .ck-footer__col--contact h3 {
        text-align: left !important;
        margin: 0 0 12px 0 !important;
        padding-bottom: 8px;
        font-size: 14px !important;
        min-height: 0 !important;
    }

    .ck-footer__col h3:after {
        margin-left: 0;
    }

    .ck-footer__col ul,
    .ck-footer__contact {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left !important;
    }

    .ck-footer__col li,
    .ck-footer__col li a {
        text-align: left !important;
        display: block !important;
        width: 100% !important;
    }

    .ck-footer__company,
    .ck-footer__office,
    .ck-footer__line {
        text-align: left !important;
        white-space: normal !important;
    }

    .ck-footer__copy {
        text-align: left;
    }
}

.ck-footer__col {
    margin-bottom: 28px;
}

.ck-footer__col--brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 100%;
    padding-right: 0;
}

.ck-footer__logo {
    display: block;
    margin: 0 0 16px;
}

.ck-footer__logo img {
    width: 250px;
    max-width: 100%;
    height: auto;
    max-height: none;
    display: block;
    mix-blend-mode: screen;
}

.ck-footer__social-label {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: #fff;
    text-transform: uppercase;
    white-space: nowrap;
    text-align: center;
}

.ck-footer__social {
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
}

.ck-footer__social a {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #fff;
    color: var(--ck-green) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    font-size: 15px;
}

.ck-footer__social a:hover {
    text-decoration: none !important;
    transform: translateY(-2px);
}

.ck-footer__social a img {
    width: 17px;
    height: 17px;
    display: block;
}

.ck-footer__col h3 {
    color: #fff !important;
    font-size: 14px;
    font-weight: 800;
    margin: 4px 0 16px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 8px;
}

.ck-footer__col h3:after {
    content: "";
    display: block;
    width: 42px;
    height: 2px;
    background: #fff;
    margin-top: 8px;
}

.ck-footer__col ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block !important;
}

.ck-footer__col li {
    display: block !important;
    float: none !important;
    width: 100% !important;
    margin-bottom: 8px;
    line-height: 1.5;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.88);
}

.ck-footer__col li a {
    display: inline-block;
}

/* Cùng style tiêu đề với Điều kiện / Thông tin — tránh lệch hàng */
.ck-footer__col--contact h3 {
    font-size: 14px;
    margin: 4px 0 16px;
}

.ck-footer__col--contact li {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 8px;
}

.ck-footer__contact li {
    margin-bottom: 10px;
}

.ck-footer__company {
    color: #fff !important;
    font-weight: 800;
    font-size: 13px;
    line-height: 1.45;
    text-transform: uppercase;
    margin-bottom: 8px !important;
    white-space: normal;
}

.ck-footer__office {
    display: block;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    margin-bottom: 2px;
    white-space: normal;
}

.ck-footer__line {
    display: block;
    white-space: normal;
    word-break: break-word;
}

.ck-footer__contact a {
    text-decoration: none;
    color: rgba(255, 255, 255, 0.92);
}

.ck-footer__copy {
    margin-top: 8px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    text-align: center;
}

.ck-footer__copy p {
    margin: 0;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.75);
}

/* ---- Shared section titles ---- */
.ck-section-title {
    text-align: center;
    color: var(--ck-green) !important;
    font-family: var(--ck-font-heading) !important;
    font-weight: 800 !important;
    font-size: 28px !important;
    letter-spacing: 0.02em;
    margin: 0 0 24px;
    text-transform: uppercase;
}

.ck-section-sub {
    text-align: center;
    color: var(--ck-muted);
    margin: -12px 0 24px;
}

.ck-btn-red {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ck-red);
    color: #fff !important;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.03em;
    padding: 12px 22px;
    border-radius: 999px;
    text-decoration: none !important;
    transition: background .2s ease;
}

.ck-btn-red:hover {
    background: var(--ck-red-dark);
    color: #fff !important;
}

/* ---- Hero ---- */
.ck-hero {
    position: relative;
    background: #fff;
}

.ck-hero__media {
    position: relative;
    overflow: hidden;
    line-height: 0;
    height: auto;
}

.ck-hero__img,
.ck-hero .home-hero-img,
body.page-home .home-hero-img,
body.page-home .ck-hero__img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: unset !important;
    object-position: center top !important;
    display: block;
}

.ck-hero .banner-slider,
.ck-hero .banner-slider.row,
.ck-hero .banner-slider .col-12,
.ck-hero .slick-list,
.ck-hero .slick-track,
.ck-hero .slick-slide {
    height: auto !important;
    margin: 0 !important;
    line-height: 0;
}

.ck-hero .slick-slide > div,
.ck-hero .slick-slide .col-12 {
    height: auto !important;
}

.ck-hero .slick-slide img {
    width: 100% !important;
    height: auto !important;
    object-fit: unset !important;
    display: block;
}

.ck-hero .banner-slider .slick-prev,
.ck-hero .banner-slider .slick-next {
    z-index: 2;
    background: var(--ck-green) !important;
}

/* ---- Booking widget 100% mock ---- */
.ck-booking,
body.page-home .home-search-bar.ck-booking {
    position: relative;
    z-index: 50;
    margin-top: -48px;
    padding-bottom: 16px;
}

.ck-booking__shell {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    z-index: 50;
}

.ck-booking__tabs {
    display: inline-flex;
    align-items: stretch;
    background: #00910D;
    border-radius: 14px 14px 0 0;
    overflow: hidden;
    margin: 0 0 -1px 28px;
    padding: 0;
    position: relative;
    z-index: 3;
    min-height: 0;
    box-sizing: border-box;
}

.ck-booking__tab {
    border: 0;
    background: transparent;
    color: #ffffff;
    font-family: var(--ck-font-heading);
    font-weight: 700;
    font-size: 15px;
    padding: 13px 36px 12px;
    cursor: pointer;
    line-height: 1.2;
    white-space: nowrap;
    border-radius: 0;
    transition: none;
    box-shadow: none;
}

.ck-booking__tab.is-active {
    background: #ffffff;
    color: #00910D;
    border-radius: 14px 14px 0 0;
    position: relative;
    z-index: 1;
    padding-bottom: 14px;
    margin-bottom: -1px;
}

.ck-booking__card,
body.page-home .home-search-bar .form-content.ck-booking__card {
    background: #ffffff !important;
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
    border: 0 !important;
    padding: 14px 12px 14px 16px;
    position: relative;
    z-index: 1;
    overflow: visible;
    opacity: 1 !important;
}

.ck-booking__fields {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    min-height: 78px;
    gap: 0;
    overflow: visible;
    background: #ffffff;
}

.ck-booking__field {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    padding: 0 12px;
    display: flex;
    align-items: center;
    align-self: stretch;
    overflow: visible;
    z-index: 1;
    background: #ffffff;
}

.ck-booking__field--route {
    z-index: 60;
}

.ck-booking__field--qty {
    z-index: 15;
    flex: 0 0 180px;
}

.ck-booking__field:not(.ck-booking__field--qty)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 22%;
    bottom: 22%;
    width: 1px;
    background: #e4e4e4;
    pointer-events: none;
}

.ck-booking__field--qty::after {
    display: none;
}

.ck-booking__row {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 56px;
    margin: 0;
}

.ck-booking__route-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 56px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: inherit;
}

.ck-booking__row > i.fa-ship,
.ck-booking__row > i.fa-calendar,
.ck-booking__row > i.fa-users,
.ck-booking__route-btn > i.fa-ship {
    color: #00910D;
    font-size: 18px;
    width: 22px;
    text-align: center;
    flex: 0 0 auto;
    pointer-events: none;
}

.ck-ico {
    width: 22px;
    height: 22px;
    object-fit: contain;
    flex: 0 0 auto;
    pointer-events: none;
    display: block;
    mix-blend-mode: normal;
}

.ck-ico--lg {
    width: 42px;
    height: 42px;
}

.ck-feature__icon {
    background: transparent !important;
    color: transparent !important;
}

.ck-feature__icon .ck-ico {
    mix-blend-mode: normal;
    width: 88px;
    height: 88px;
}

.ck-booking__caret {
    margin-left: auto;
    color: #666;
    font-size: 14px;
    flex: 0 0 auto;
    pointer-events: none;
}

.ck-booking__label,
.ck-booking__route-text {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ck-booking__route-text.is-set {
    color: #222;
    letter-spacing: 0;
    text-transform: none;
}

.ck-booking__select-hidden {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.ck-booking__menu {
    display: none;
    position: absolute;
    left: 8px;
    top: calc(100% + 4px);
    width: 280px;
    max-width: calc(100vw - 32px);
    background: #fff;
    border: 1px solid #00910D;
    border-radius: 6px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
    z-index: 80;
    padding: 8px;
}

.ck-booking__field--route.is-open .ck-booking__menu {
    display: block;
}

.ck-booking__menu-search {
    display: block;
    width: 100%;
    height: 36px;
    border: 1px solid #00910D;
    border-radius: 4px;
    padding: 0 10px;
    margin: 0 0 8px;
    font-size: 14px;
    outline: 0;
    background: #fff;
}

.ck-booking__menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 220px;
    overflow: auto;
}

.ck-booking__menu-item {
    min-height: 40px;
    line-height: 40px;
    padding: 0 12px;
    margin: 0 0 2px;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    background: #f0f0f0;
    cursor: pointer;
    user-select: none;
}

.ck-booking__menu-item:hover,
.ck-booking__menu-item.is-active {
    background: #00910D;
    color: #fff;
}

.ck-booking__input,
.ck-booking__field input#dGo,
.ck-booking__field input#dRoundGo {
    flex: 1 1 auto;
    min-width: 0;
    width: 100% !important;
    height: 40px !important;
    line-height: 40px !important;
    border: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
    outline: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #555 !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    display: block !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: static !important;
    -webkit-appearance: none;
    appearance: none;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ck-booking__field input#dGo:not(:placeholder-shown),
.ck-booking__field input#dRoundGo:not(:placeholder-shown) {
    text-transform: none;
    letter-spacing: 0;
    color: #222 !important;
}

.ck-booking__field input::placeholder {
    color: #555;
    font-weight: 700;
    opacity: 1;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ck-booking__qty-input,
.ck-booking__field input#numCus {
    flex: 0 0 52px !important;
    width: 52px !important;
    max-width: 52px !important;
    height: 40px !important;
    font-weight: 800 !important;
    color: #222 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    padding: 0 !important;
    margin: 0 0 0 auto !important;
    text-align: center !important;
    cursor: text !important;
    pointer-events: auto !important;
    opacity: 1 !important;
    position: static !important;
    -moz-appearance: textfield;
    appearance: textfield;
}

.ck-booking__qty-input::-webkit-outer-spin-button,
.ck-booking__qty-input::-webkit-inner-spin-button,
.ck-booking__field input#numCus::-webkit-outer-spin-button,
.ck-booking__field input#numCus::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#ckQtyLabel {
    flex: 1 1 auto;
}

.ck-booking__stack {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 4px 6px 2px;
}

.ck-booking__route-block {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ck-booking__route-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 4px;
}

.ck-booking__route-label {
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.04em;
    color: #555;
    text-transform: uppercase;
}

.ck-booking__route-label.is-set {
    color: #222;
}

.ck-booking__route-chips {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.ck-booking__route-chip {
    appearance: none;
    border: 2px solid #00910D;
    background: #fff;
    color: #00910D;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    padding: 14px 12px;
    border-radius: 10px;
    cursor: pointer;
    line-height: 1.25;
    text-align: center;
    transition: background .15s ease, color .15s ease;
}

.ck-booking__route-chip.is-active,
.ck-booking__route-chip:hover {
    background: #00910D;
    color: #fff;
}

.ck-booking__field.is-disabled {
    opacity: 0.45;
    pointer-events: none;
}

.ck-booking__stack .ck-booking__fields {
    min-height: 64px;
    border: 1px solid #ebebeb;
    border-radius: 12px;
    padding: 4px 6px;
}

.ck-booking__submit--bar {
    flex: none;
    width: 100%;
    padding: 0;
}

.ck-booking__submit--bar .ck-booking__btn {
    width: 100% !important;
    border-radius: 12px !important;
    min-height: 52px;
}

.ck-booking__submit {
    flex: 0 0 auto;
    padding: 4px 4px 4px 8px;
    display: flex;
    align-items: center;
    background: #ffffff;
}

.ck-booking__btn,
.ck-booking__btn.nir-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 56px;
    padding: 0 28px !important;
    border-radius: 28px !important;
    background: #00910D !important;
    color: #fff !important;
    font-family: var(--ck-font-heading) !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    letter-spacing: 0.04em;
    white-space: nowrap;
    margin: 0 !important;
    text-decoration: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

.ck-booking__btn:hover {
    background: #007a0b !important;
    color: #fff !important;
}

.ck-booking__btn::before {
    display: none !important;
}

#ui-datepicker-div {
    z-index: 10060 !important;
}

/* Mũi tên tháng: chữ ‹ › màu đen, không dùng sprite PNG */
#ui-datepicker-div .ui-datepicker-header {
    position: relative;
    overflow: visible !important;
    padding: 4px 8px;
}

#ui-datepicker-div .ui-datepicker-title {
    margin: 0 36px !important;
    line-height: 32px !important;
}

#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
    position: absolute !important;
    top: 50% !important;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    margin-top: -16px !important;
    padding: 0 !important;
    cursor: pointer;
    z-index: 20 !important;
    display: block !important;
    opacity: 1 !important;
    border: 0 !important;
    border-radius: 0;
    text-decoration: none !important;
    overflow: visible !important;
    background-color: transparent !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 18px 18px !important;
}

#ui-datepicker-div .ui-datepicker-prev {
    left: 4px !important;
    right: auto !important;
    background-image: url("/Content/images/dp-arrow-left.png") !important;
}
#ui-datepicker-div .ui-datepicker-next {
    right: 4px !important;
    left: auto !important;
    background-image: url("/Content/images/dp-arrow-right.png") !important;
}

#ui-datepicker-div .ui-datepicker-prev span,
#ui-datepicker-div .ui-datepicker-next span {
    display: none !important;
}

#ui-datepicker-div .ui-datepicker-prev.ui-state-disabled,
#ui-datepicker-div .ui-datepicker-next.ui-state-disabled {
    opacity: 0.35 !important;
    cursor: default;
    pointer-events: none;
}

#ui-datepicker-div .ui-datepicker-prev:hover:not(.ui-state-disabled),
#ui-datepicker-div .ui-datepicker-next:hover:not(.ui-state-disabled) {
    background: transparent !important;
    color: #000 !important;
}

@media (max-width: 991px) {
    .ck-booking,
    body.page-home .home-search-bar.ck-booking {
        margin-top: -24px;
    }

    .ck-booking__card {
        border-radius: 16px;
        padding: 10px;
    }

    .ck-booking__tabs {
        margin-left: 12px;
    }

    .ck-booking__fields {
        flex-wrap: wrap;
    }

    .ck-booking__field,
    .ck-booking__field--qty {
        flex: 1 1 45%;
    }

    .ck-booking__field::after {
        display: none !important;
    }

    .ck-booking__submit {
        flex: 1 1 100%;
        padding: 10px;
    }

    .ck-booking__btn {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .ck-booking__field,
    .ck-booking__field--qty {
        flex: 1 1 100%;
        border-bottom: 1px solid #eee;
        padding-bottom: 8px;
        margin-bottom: 4px;
    }
}

/* ---- Features ---- */
/* ---- /dat-ve visual (IDs cũ giữ nguyên: tripsGo, dGo, dRoundGo, numCus, ulLstGo...) ---- */
/* ========== /dat-ve — khớp mock full-page ========== */
body.page-booking .ck-datve .booking-filter-panel,
body.page-booking .ck-datve__card.booking-filter-panel {
    background: #fff !important;
    color: #222 !important;
}

body.page-booking .ck-datve .ck-datve__tab,
body.page-booking .ck-datve button.ck-datve__tab {
    background: transparent !important;
    border: 0 !important;
    color: #fff !important;
    pointer-events: auto !important;
}

body.page-booking .ck-datve .ck-datve__tab.is-active,
body.page-booking .ck-datve .ck-datve__tab.active,
body.page-booking .ck-datve button.ck-datve__tab.is-active,
body.page-booking .ck-datve button.ck-datve__tab.active {
    background: #fff !important;
    color: #00910D !important;
}

.ck-datve {
    background: #fff;
}

.ck-datve__hero {
    line-height: 0;
    overflow: hidden;
    background: #dff3e2;
}

.ck-datve__hero-img {
    width: 100%;
    height: clamp(280px, 38vw, 460px);
    object-fit: cover;
    object-position: center center;
    display: block;
}

.ck-datve__widget-wrap {
    position: relative;
    z-index: 40;
    margin-top: -150px;
    padding: 0 0 48px;
}

.ck-datve__shell {
    position: relative;
    max-width: 640px;
    width: 100%;
    margin: 0 auto;
    isolation: isolate;
}

/* Tab dính mép card: nền xanh, tab active trắng nhập vào card */
.ck-datve__tabs {
    display: inline-flex;
    align-items: stretch;
    background: #00910D;
    border-radius: 16px 16px 0 0;
    overflow: hidden;
    position: relative;
    z-index: 20;
    margin: 0 0 -1px 28px;
    padding: 0;
    pointer-events: auto;
}

.ck-datve__tab {
    appearance: none;
    position: relative;
    z-index: 21;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font-family: var(--ck-font-heading);
    font-weight: 800 !important;
    font-size: 17px !important;
    padding: 15px 42px 14px !important;
    cursor: pointer !important;
    line-height: 1.2;
    white-space: nowrap;
    border-radius: 0 !important;
    float: none !important;
    max-width: none !important;
    pointer-events: auto !important;
}

.ck-datve__tab.is-active,
.ck-datve__tab.active {
    background: #fff !important;
    color: #00910D !important;
    border-radius: 16px 16px 0 0 !important;
    z-index: 22;
    padding-bottom: 16px !important;
    margin-bottom: -1px;
}

.ck-datve__card.booking-filter-panel {
    background: #fff !important;
    text-align: left !important;
    border-radius: 20px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.18);
    padding: 28px 32px 26px !important;
    display: flex;
    flex-direction: column;
    gap: 22px;
    position: relative;
    z-index: 1;
}

.ck-datve__select-native {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0);
}

.ck-datve__route-block {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* TUYẾN: icon + chữ xám + caret phải, chỉ gạch dưới mỏng */
.ck-datve__route-label {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    margin: 0;
    padding: 4px 4px 14px;
    border: 0;
    border-bottom: 1px solid #d0d0d0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-family: var(--ck-font-heading);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6e6e6e;
    line-height: 1.2;
    cursor: pointer;
    text-align: left;
}

.ck-datve__route-label .ck-ico {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    object-fit: contain;
}

.ck-datve__route-label > span#ckDatveRouteText.is-set {
    color: #222;
    letter-spacing: 0.02em;
}

.ck-datve__route-label .ck-datve__caret {
    margin-left: auto;
    position: static;
    transform: none;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 10px solid #8e8e8e;
    font-size: 0;
    line-height: 0;
    transition: transform .15s ease;
}

.ck-datve__route-block.is-open .ck-datve__caret {
    transform: rotate(180deg);
}

.ck-datve__chips {
    display: none;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 14px 0 4px;
}

.ck-datve__route-block.is-open .ck-datve__chips {
    display: flex;
}

.ck-datve__chip {
    appearance: none;
    width: 100%;
    max-width: 340px;
    border: 2px solid #00910D;
    background: #f4f4f4;
    color: #1a1a1a;
    border-radius: 10px;
    min-height: 52px;
    padding: 12px 18px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    column-gap: 10px;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.ck-datve__chip-name:first-child {
    justify-self: end;
    text-align: right;
}

.ck-datve__chip-name:last-child {
    justify-self: start;
    text-align: left;
}

.ck-datve__chip-mid {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    justify-self: center;
}

.ck-datve__chip-arr {
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    color: #333;
}

.ck-datve__chip-ico {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.ck-datve__chip.is-active {
    background: #00910D;
    border-color: #00910D;
    color: #fff;
    box-shadow: 0 8px 18px rgba(0, 145, 13, 0.22);
}

.ck-datve__chip.is-active .ck-datve__chip-arr {
    color: #fff;
}

.ck-datve__chip.is-active .ck-datve__chip-ico {
    filter: brightness(0) invert(1);
}

.ck-datve__fields {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    width: 100%;
    max-width: 560px;
    margin: 8px auto 0;
    gap: 0;
}

.ck-datve__field {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 !important;
    padding: 12px 4px 14px;
    min-height: 58px;
    border: 0 !important;
    border-bottom: 2px solid #e0e0e0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    position: relative;
    z-index: 2;
    cursor: pointer;
    pointer-events: auto !important;
}

.ck-datve__field + .ck-datve__field {
    margin-left: 36px !important;
}

.ck-datve__field .ck-ico {
    width: 26px;
    height: 26px;
    flex: 0 0 auto;
    object-fit: contain;
}

.ck-datve #divdRoundGo {
    display: flex !important;
}

.ck-datve__field.is-disabled {
    opacity: 0.38;
    pointer-events: none !important;
    cursor: default;
}

.ck-datve__field.is-disabled .ck-ico {
    filter: grayscale(1) opacity(0.7);
}

.ck-datve__field .fa,
.ck-datve__field i {
    display: none !important;
}

.ck-datve__field input.search-form-input,
.ck-datve__field input#dGo,
.ck-datve__field input#dRoundGo,
.ck-datve__field input#numCus {
    flex: 1 1 auto;
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
    min-height: 40px;
    font-family: var(--ck-font-heading);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #222;
    padding: 0 !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    position: relative;
    z-index: 3;
    -webkit-user-select: none;
    user-select: none;
}

body.page-booking #ui-datepicker-div {
    z-index: 10060 !important;
}

.ck-datve__field input::placeholder {
    color: #9a9a9a;
    opacity: 1;
    font-weight: 700;
}

.ck-datve__field--qty input {
    text-transform: none;
    font-weight: 800;
    font-size: 16px;
}

.ck-datve__search {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 100%;
    max-width: 380px;
    border: 0;
    border-radius: 12px;
    min-height: 56px;
    margin: 6px auto 0;
    background: #00910D;
    color: #fff;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 0.08em;
    cursor: pointer;
    gap: 12px;
}

.ck-datve__search:hover {
    background: #007a0b;
}

.ck-datve__results {
    padding: 8px 0 28px;
    background: #fafafa;
}

.ck-datve__results.is-empty {
    display: none;
}

.ck-datve__steps {
    background: transparent !important;
    padding: 0 0 14px !important;
    margin: 0 !important;
}

.ck-datve__steps .breadcrumb {
    background: #C8E6C9 !important;
    margin: 0;
    padding: 10px 16px !important;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    border-radius: 8px;
}

.ck-datve__steps .breadcrumb > li + li:before {
    content: "›";
    color: #2E7D32;
    padding: 0 8px 0 0;
}

.ck-datve__steps .breadcrumb li a {
    color: #1B5E20 !important;
    font-weight: 700;
    font-size: 12px;
    text-decoration: none;
}

.ck-datve__list-title {
    text-align: left !important;
    color: #fff !important;
    font-weight: 800 !important;
    font-size: 16px !important;
    padding: 12px 10px !important;
}

.ck-datve .list-timer {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
    padding: 0 0 12px;
    overflow: hidden;
}

.ck-datve .responsive-table {
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

.ck-datve .responsive-table .table-header {
    background: #00910D !important;
}

.ck-datve .responsive-table .col {
    float: left;
    padding: 8px 6px;
    box-sizing: border-box;
}

.ck-datve .table-row {
    clear: both;
    overflow: hidden;
    border-bottom: 1px solid #eee;
}

.ck-datve .table-col-labels {
    background: #f5f9f5;
    font-weight: 700;
}

.ck-datve__continue-wrap {
    text-align: center;
    padding: 22px 0 8px;
}

.ck-datve__continue {
    min-width: 260px;
    padding: 13px 24px !important;
    border-radius: 10px !important;
    background: #00910D !important;
    border-color: #007a0b !important;
    font-weight: 800 !important;
}

.ck-datve .ck-explore {
    margin-top: 4px;
    padding-top: 28px;
}

@media (max-width: 767px) {
    .ck-datve__widget-wrap {
        margin-top: -72px;
        padding: 0 14px 32px;
    }

    .ck-datve__shell {
        max-width: 100%;
    }

    .ck-datve__tabs {
        margin-left: 16px;
    }

    .ck-datve__tab {
        padding: 12px 22px 11px !important;
        font-size: 14px !important;
    }

    .ck-datve__card.booking-filter-panel {
        padding: 22px 18px 20px !important;
        gap: 18px;
    }

    .ck-datve__fields {
        flex-direction: column;
    }

    .ck-datve__field + .ck-datve__field {
        margin-left: 0 !important;
    }

    .ck-datve__hero-img {
        height: 220px;
    }

    /* Chip tuyến: giữ 1 hàng ngang như web (A — tàu — B) */
    .ck-datve__chip {
        max-width: 100%;
        grid-template-columns: 1fr auto 1fr !important;
        column-gap: 8px;
        row-gap: 0;
        padding: 10px 12px;
        min-height: 48px;
        align-items: center;
    }

    .ck-datve__chip-name:first-child {
        justify-self: end;
        text-align: right;
        white-space: nowrap;
        font-size: 12px;
    }

    .ck-datve__chip-name:last-child {
        justify-self: start;
        text-align: left;
        white-space: nowrap;
        font-size: 12px;
    }

    .ck-datve__chip-mid {
        gap: 6px;
    }

    .ck-datve__chip-arr {
        font-size: 16px;
    }

    .ck-datve__chip-ico {
        width: 28px;
        height: 28px;
    }

    .ck-datve__fields {
        max-width: 100%;
    }

    .ck-datve__search {
        max-width: 100%;
    }
}

@media (min-width: 992px) {
    .ck-datve__shell {
        max-width: 680px;
    }

    .ck-datve__card.booking-filter-panel {
        padding: 32px 40px 30px !important;
        gap: 24px;
    }

    .ck-datve__fields {
        max-width: 100%;
        padding: 0 8px;
    }

    .ck-datve__field + .ck-datve__field {
        margin-left: 48px !important;
    }
}

/* legacy unused blocks from earlier draft (safe no-op if absent) */
.ck-book,
.ck-features {
    padding: 48px 0 20px;
    background: #fff;
}

.ck-feature {
    text-align: center;
    padding: 16px 12px 28px;
}

.ck-feature__icon {
    width: auto;
    height: auto;
    margin: 0 auto 16px;
    border-radius: 0;
    background: transparent !important;
    color: var(--ck-green);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
}

.ck-feature__icon .ck-ico,
.ck-feature__icon .ck-ico--lg {
    width: 88px;
    height: 88px;
}

.ck-feature h3 {
    color: var(--ck-green);
    font-size: 15px;
    font-weight: 800;
    margin: 0 0 10px;
    letter-spacing: 0.02em;
}

.ck-feature p {
    color: var(--ck-muted);
    font-size: 14px;
    line-height: 1.55;
    margin: 0;
}

/* ---- About ---- */
.ck-about {
    padding: 40px 0 56px;
    background: #f6faf6;
}

.ck-about__eyebrow {
    color: var(--ck-green);
    font-weight: 700;
    margin: 0 0 8px;
}

.ck-about__content h2 {
    color: var(--ck-green);
    font-weight: 800;
    font-size: 30px;
    margin: 0 0 16px;
    line-height: 1.25;
}

.ck-about__content p {
    color: #444;
    line-height: 1.7;
    margin-bottom: 22px;
}

.ck-about-page .ck-features {
    padding: 8px 0 12px !important;
    background: #fff;
}

.ck-about-main {
    padding: 12px 0 72px !important;
    background: #fff;
}

.ck-sidenav {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    padding: 10px 0;
    margin-bottom: 28px;
}

.ck-sidenav a {
    display: block;
    padding: 12px 18px 12px 22px;
    color: #333 !important;
    text-decoration: none !important;
    font-size: 15px;
    line-height: 1.45;
    border-left: 3px solid transparent;
}

.ck-sidenav a:hover,
.ck-sidenav a.is-active {
    color: #00910D !important;
    font-weight: 700;
    border-left-color: #00910D;
    background: #f4faf4;
}

.ck-about-page__body {
    padding-top: 4px;
}

.ck-about-page .ck-about__eyebrow {
    color: #222;
    font-size: 16px;
    font-weight: 500;
    margin: 0 0 8px;
}

.ck-about-page__body h2 {
    color: #00910D;
    font-size: 28px;
    font-weight: 800;
    margin: 0 0 16px;
    letter-spacing: 0.02em;
}

.ck-about-page__html {
    color: #555;
    font-size: 15px;
    line-height: 1.75;
}

.ck-about-page__html p {
    margin: 0 0 14px;
    color: #555;
}

.ck-about-page__html h3 {
    margin: 28px 0 12px;
    font-size: 18px;
    font-weight: 800;
    color: #222;
}

.ck-about-page__html h4 {
    margin: 20px 0 8px;
    font-size: 15px;
    font-weight: 700;
    color: #333;
}

.ck-about-page__html a {
    color: #00910D;
    font-weight: 600;
}

.ck-refund-table-wrap {
    overflow-x: auto;
    margin: 8px 0 24px;
    -webkit-overflow-scrolling: touch;
}

.ck-refund-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 1.5;
}

.ck-refund-table th,
.ck-refund-table td {
    border: 1px solid #d7e2d8;
    padding: 12px 14px;
    vertical-align: top;
    text-align: left;
}

.ck-refund-table th {
    background: #00910D;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.ck-refund-table td:first-child {
    font-weight: 800;
    color: #00910D;
    white-space: nowrap;
}

.ck-refund-table tbody tr:nth-child(even) td {
    background: #f6faf6;
}

.ck-about-panel {
    display: none;
}

.ck-about-panel.is-active {
    display: block;
}

.ck-about__media {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
    position: relative;
}

.ck-about__photos {
    position: relative;
    height: 380px;
    overflow: hidden;
    background: #e8e8e8;
}

.ck-about__photos img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 380px;
    object-fit: cover;
    display: block;
    opacity: 0;
    animation: ckAboutFade 12s infinite;
}

.ck-about__photos img:nth-child(1) {
    opacity: 1;
    animation-delay: 0s;
}

.ck-about__photos img:nth-child(2) {
    animation-delay: 4s;
}

.ck-about__photos img:nth-child(3) {
    animation-delay: 8s;
}

@keyframes ckAboutFade {
    0% { opacity: 1; }
    28% { opacity: 1; }
    36% { opacity: 0; }
    100% { opacity: 0; }
}

.ck-about__dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14px;
    display: flex;
    justify-content: center;
    gap: 8px;
    z-index: 3;
    margin: 0;
    padding: 0;
}

.ck-about__dots button {
    width: 22px;
    height: 6px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.75);
    cursor: pointer;
}

.ck-about__dots button.is-on {
    background: #00910D;
    width: 28px;
}

.ck-about__slider .slick-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14px;
    display: flex !important;
    justify-content: center;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
    z-index: 2;
}

.ck-about__slider .slick-dots li {
    margin: 0;
    width: auto;
    height: auto;
}

.ck-about__slider .slick-dots li button {
    width: 22px;
    height: 6px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.75);
    font-size: 0;
    line-height: 0;
    cursor: pointer;
}

.ck-about__slider .slick-dots li button:before {
    display: none;
    content: none;
}

.ck-about__slider .slick-dots li.slick-active button {
    background: #00910D;
    width: 28px;
}

/* ---- Schedule ---- */
.ck-schedule {
    padding: 56px 0 64px;
    position: relative;
    background:
        repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.22) 0 1px, transparent 1px 18px),
        repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.18) 0 1px, transparent 1px 18px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.42) 0%, rgba(255, 255, 255, 0.55) 100%),
        url(/Content/images/bg-lich-tau.png?v=1) center / cover no-repeat;
}

.ck-schedule .ck-section-title {
    color: #00910D !important;
    font-family: var(--ck-font-heading) !important;
    font-weight: 800 !important;
    font-size: 28px !important;
    margin-bottom: 28px;
}

.ck-date-strip-wrap {
    position: relative;
    margin: 0 0 16px;
}

.ck-date-strip {
    display: flex;
    gap: 3px;
    overflow-x: scroll;
    overflow-y: hidden;
    padding: 0;
    margin: 0;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
    background: transparent;
    scrollbar-width: none; /* dùng thanh kéo custom bên dưới */
    -ms-overflow-style: none;
}

.ck-date-strip::-webkit-scrollbar {
    display: none;
    height: 0;
}

.ck-date-scroll {
    position: relative;
    display: block !important;
    height: 5px;
    margin-top: 8px;
    background: #cfe8d2;
    border-radius: 999px;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}

.ck-date-scroll__thumb {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    min-width: 48px;
    width: 30%;
    background: #0d7a1a;
    border-radius: 999px;
    cursor: grab;
    box-shadow: none;
}

.ck-date-strip.is-dragging {
    cursor: grabbing;
    user-select: none;
}

.ck-date-strip__item {
    flex: 0 0 auto;
    min-width: 96px;
    border: 0;
    background: #1a9b2a;
    border-radius: 4px;
    padding: 6px 10px;
    cursor: pointer;
    text-align: center;
    color: #fff;
    transition: background .15s ease;
    line-height: 1.25;
}

.ck-date-strip__item:hover {
    background: #148a22;
}

.ck-date-strip__item.is-active {
    background: #0d7a1a;
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.2);
}

.ck-date-strip__wd {
    display: block !important;
    font-family: var(--ck-font-body);
    font-size: 12px;
    font-weight: 700;
    opacity: 1;
    margin: 0 0 2px;
    white-space: nowrap;
    visibility: visible !important;
    color: #fff !important;
}

.ck-date-strip__day {
    display: block;
    font-family: var(--ck-font-heading);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
    margin: 0;
}

.ck-schedule__table-wrap {
    background: #fff;
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
    border: 1px solid #e5e5e5;
}

.ck-schedule__table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    table-layout: fixed;
}

.ck-schedule__table th {
    background: #ececec;
    color: #00910D !important;
    font-family: var(--ck-font-heading) !important;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.04em;
    padding: 14px 16px;
    border: 1px solid #ddd;
    text-align: left;
    text-transform: uppercase;
}

.ck-schedule__table th:last-child {
    width: 140px;
}

.ck-schedule__table td {
    padding: 16px;
    border: 1px solid #e8e8e8;
    vertical-align: middle;
    font-size: 15px;
    font-family: var(--ck-font-body);
    color: #222;
    background: #fff;
}

.ck-schedule__table tbody tr:hover td {
    background: #f7fbf7;
}

.ck-schedule__seats {
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 16px;
    color: #e31c23 !important;
}

.ck-schedule__book {
    color: #e31c23 !important;
    font-family: var(--ck-font-heading) !important;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.03em;
    text-decoration: none !important;
    white-space: nowrap;
}

.ck-schedule__book:hover {
    text-decoration: underline !important;
}

.ck-schedule__empty,
.ck-schedule__loading {
    text-align: center;
    padding: 28px 12px;
    color: #555;
    background: #fff;
    border: 1px solid #e5e5e5;
}

/* ---- Schedule page ---- */
.ck-schedule-page section {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.ck-schedule-page .ck-schedule {
    padding: 8px 0 56px !important;
}

.ck-schedule-page .ck-schedule .ck-section-title {
    margin-bottom: 24px;
}

.ck-schedule-months {
    padding: 48px 0 64px !important;
    background: #fff;
}

.ck-schedule-page .ck-schedule-months {
    padding: 88px 0 64px !important;
}

.ck-schedule-month {
    margin-bottom: 32px;
}

.ck-schedule-month__title {
    margin: 0 0 20px;
    text-align: center;
    font-family: var(--ck-font-heading);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: #222;
    text-transform: uppercase;
}

.ck-schedule-month__media {
    overflow: hidden;
    background: #fff;
    border: 1px solid #e5e5e5;
}

.ck-schedule-month__media a {
    display: block;
}

.ck-schedule-month__media img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

.ck-schedule-months__hint {
    display: none;
    margin: 0 0 16px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: #00910D;
}

.ck-schedule-months__cms {
    margin-top: 12px;
    text-align: center;
}

.ck-schedule-months__cms img {
    max-width: 100%;
    height: auto;
}

/* Mobile/tablet: ảnh lịch scale vừa khít màn hình (desktop giữ nguyên) */
@media (max-width: 991px) {
    .ck-schedule-months__hint {
        display: block;
    }

    .ck-schedule-page .ck-schedule-months {
        padding: 24px 0 40px !important;
    }

    .ck-schedule-page .ck-schedule-months .container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .ck-schedule-page .ck-schedule-months .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .ck-schedule-page .ck-schedule-months [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 20px;
    }

    .ck-schedule-month {
        margin-bottom: 28px;
    }

    .ck-schedule-month__title {
        font-size: 15px;
        margin-bottom: 10px;
    }

    .ck-schedule-month__media {
        overflow: hidden;
        max-width: 100%;
        width: 100%;
        border: 1px solid #e5e5e5;
        background: #fff;
    }

    .ck-schedule-month__media a {
        display: block;
        width: 100%;
        max-width: 100%;
    }

    .ck-schedule-month__media img {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        display: block;
        object-fit: contain;
    }
}

/* ---- News page ---- */
.ck-news-page section {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.ck-news {
    padding: 4px 0 12px !important;
    background: #fff;
}

.ck-news__title {
    margin: 0 0 12px;
    text-align: center;
    font-family: var(--ck-font-heading);
    font-size: 28px;
    font-weight: 800;
    color: var(--ck-green);
    letter-spacing: 0.04em;
}

.ck-news__intro {
    max-width: 920px;
    margin: 0 auto 28px;
    text-align: center;
    color: #444;
    font-size: 14px;
    line-height: 1.7;
}

.ck-news-page,
.ck-news-page .container,
.ck-news,
body.page-news {
    overflow: visible !important;
}

.ck-news__slider-outer {
    padding: 0 52px;
    margin: 0 -52px 8px;
}

.ck-news__slider-wrap {
    position: relative;
    display: block;
    padding: 0;
    margin: 0;
}

.ck-news__slider {
    display: flex;
    width: 100%;
    gap: 30px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0;
    margin: 0;
}

.ck-news__slider::-webkit-scrollbar {
    display: none;
}

.ck-news__slide {
    flex: 0 0 calc((100% - 90px) / 4);
    max-width: calc((100% - 90px) / 4);
    min-width: 0;
    scroll-snap-align: start;
    margin-bottom: 0 !important;
    height: auto !important;
}

.ck-news__nav {
    position: absolute;
    top: 72px;
    z-index: 6;
    flex: none;
    width: 36px;
    height: 36px;
    margin: 0;
    border: none;
    border-radius: 50%;
    background: var(--ck-green);
    color: #fff;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 145, 13, 0.25);
}

/* Ngoài hàng ảnh — 3 hàng card vẫn thẳng mép nhau */
.ck-news__nav--prev {
    left: -52px;
    right: auto;
}

.ck-news__nav--next {
    right: -52px;
    left: auto;
}

.ck-news-grid {
    padding: 28px 0 8px !important;
    background: #fff;
}

.ck-news-grid__title,
.ck-news-page .ck-cards-section .ck-section-title {
    margin: 0 0 22px !important;
    padding-bottom: 10px;
    text-align: left !important;
    font-family: var(--ck-font-heading) !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    color: var(--ck-green) !important;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    border-bottom: 1px solid #e5e5e5;
}

.ck-news-grid__row {
    display: flex;
    flex-wrap: wrap;
}

.ck-news-grid__row > [class*="col-"] {
    display: flex;
    margin-bottom: 22px;
}

.ck-news-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    margin: 0;
    background: transparent;
    box-shadow: none;
}

.ck-news-card__media {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: #e9f3ea;
    text-decoration: none !important;
}

.ck-news-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}

.ck-news-card:hover .ck-news-card__media img {
    transform: scale(1.04);
}

.ck-news-card__body {
    padding: 12px 2px 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

.ck-news-card__title,
.ck-news-card__body h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    color: #222;
    line-height: 1.45;
    min-height: 2.7em;
}

.ck-news-card__title a,
.ck-news-card__body h3 a {
    color: inherit;
    text-decoration: none;
}

.ck-news-card__title a:hover,
.ck-news-card__body h3 a:hover {
    color: var(--ck-green);
}

.ck-news-card__desc,
.ck-news-card__body p {
    margin: 0;
    font-size: 13px;
    color: #666;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ck-news-page .ck-cards-section,
.ck-news-page .ck-cards-section--cargo {
    padding: 28px 0 48px !important;
    background: #fff;
    border-top: none;
}

.ck-news-page .ck-cards-section .row {
    display: flex;
    flex-wrap: wrap;
}

.ck-news-page .ck-cards-section .row > [class*="col-"] {
    display: flex;
    margin-bottom: 22px;
}

.ck-news-page .ck-card {
    width: 100%;
    margin-bottom: 0;
    height: auto;
}

.ck-news-page .ck-card__body h3 {
    min-height: 2.7em;
    font-size: 15px;
}

.ck-news-page .ck-card__body p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 13px;
    color: #666;
}

@media (max-width: 991px) {
    .ck-news__slide {
        flex: 0 0 calc((100% - 30px) / 2);
        max-width: calc((100% - 30px) / 2);
    }
    .ck-news__slider-outer {
        padding: 0 28px;
        margin: 0 -28px 8px;
    }
    .ck-news__nav--prev { left: -28px; }
    .ck-news__nav--next { right: -28px; }
}

@media (max-width: 575px) {
    .ck-news__slide {
        flex: 0 0 85%;
        max-width: 85%;
    }
    .ck-news__slider-outer {
        padding: 0 22px;
        margin: 0 -8px 8px;
    }
    .ck-news__nav {
        width: 30px;
        height: 30px;
        top: 56px;
        font-size: 22px;
    }
    .ck-news__nav--prev { left: -18px; }
    .ck-news__nav--next { right: -18px; }
    .ck-news-card__title,
    .ck-news-card__body h3,
    .ck-news-page .ck-card__body h3 {
        min-height: 0;
    }
}

/* ---- News detail ---- */
.ck-news-detail-page section {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.ck-news-detail {
    padding: 4px 0 36px !important;
    background: #fff;
}

.ck-news-detail__main {
    margin-bottom: 28px;
}

.ck-news-detail__title {
    margin: 0 0 12px;
    font-family: var(--ck-font-body);
    font-size: 26px;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.01em;
    color: #1a1a1a;
    font-synthesis: none;
}

.ck-news-detail__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 0 0 14px;
    font-size: 13px;
    color: #777;
}

.ck-news-detail__meta i {
    margin-right: 6px;
    color: var(--ck-green);
}

.ck-news-detail__lead {
    margin: 0 0 18px;
    padding: 12px 14px;
    border-left: 3px solid var(--ck-green);
    background: #f4faf4;
    color: #444;
    font-size: 15px;
    line-height: 1.6;
}

.ck-news-detail__cover {
    margin: 0 0 22px;
    overflow: hidden;
    background: #e9f3ea;
}

.ck-news-detail__cover img {
    width: 100%;
    height: auto;
    max-height: 460px;
    object-fit: cover;
    display: block;
}

.ck-news-detail__content {
    color: #333;
    font-size: 15px;
    line-height: 1.75;
}

.ck-news-detail__content p {
    margin: 0 0 14px;
}

.ck-news-detail__content img {
    max-width: 100%;
    height: auto;
    margin: 12px 0;
}

.ck-news-detail__content h1,
.ck-news-detail__content h2,
.ck-news-detail__content h3,
.ck-news-detail__content h4 {
    margin: 22px 0 10px;
    font-family: var(--ck-font-body);
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.01em;
    color: #1a1a1a;
    font-synthesis: none;
}

/* Poppins ExtraBold làm dấu tiếng Việt dính/méo — dùng Be Vietnam Pro */
.ck-news-detail__title,
.ck-news-detail__content h1,
.ck-news-detail__content h2,
.ck-news-detail__content h3,
.ck-news-detail__content h4,
.ck-news-detail__content h5,
.ck-news-detail__content strong,
.ck-news-detail__content b {
    font-family: "Be Vietnam Pro", "Segoe UI", Tahoma, sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em;
    font-synthesis: none;
}

.ck-news-detail__content a {
    color: var(--ck-green);
}

.ck-news-detail__kicker {
    margin: 0 0 8px;
    color: var(--ck-green);
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ck-news-detail__gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 16px 0 22px;
}

.ck-news-detail__gallery img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    margin: 0;
    display: block;
}

.ck-news-detail__credit {
    font-size: 13px;
    color: #888;
    font-style: italic;
}

.ck-news-detail__contact {
    margin: 22px 0 8px;
    padding: 16px 18px;
    border: 1px solid #d7ead8;
    background: #f4faf4;
}

.ck-news-detail__contact h3 {
    margin: 0 0 12px !important;
    color: var(--ck-green);
}

.ck-news-detail__contact p {
    margin: 0 0 12px;
}

.ck-news-detail__contact p:last-child {
    margin-bottom: 0;
}

.ck-news-detail__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid #e8e8e8;
}

.ck-news-detail__back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #555 !important;
    font-weight: 600;
    text-decoration: none !important;
}

.ck-news-detail__back:hover {
    color: var(--ck-green) !important;
}

.ck-news-detail__book {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    padding: 10px 18px;
    background: #e31c23;
    color: #fff !important;
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.03em;
    text-decoration: none !important;
    border-radius: 4px;
}

.ck-news-detail__book:hover {
    background: #c4161c;
    color: #fff !important;
}

.ck-news-detail__side {
    position: sticky;
    top: calc(var(--ck-header-h) + 16px);
    padding: 18px 16px 20px;
    border: 1px solid #e8e8e8;
    background: #fff;
}

.ck-news-detail__side-title {
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--ck-green);
    font-family: var(--ck-font-heading);
    font-size: 16px;
    font-weight: 800;
    color: var(--ck-green);
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.ck-news-side-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ck-news-side-item {
    display: flex;
    gap: 12px;
    text-decoration: none !important;
    color: inherit;
}

.ck-news-side-item__thumb {
    flex: 0 0 88px;
    width: 88px;
    height: 66px;
    overflow: hidden;
    background: #e9f3ea;
}

.ck-news-side-item__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ck-news-side-item__body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ck-news-side-item__title {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    color: #222;
}

.ck-news-side-item:hover .ck-news-side-item__title {
    color: var(--ck-green);
}

.ck-news-side-item__date {
    font-size: 12px;
    color: #888;
}

.ck-news-side-empty {
    margin: 0;
    font-size: 13px;
    color: #777;
}

.ck-news-detail__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 18px;
    padding: 12px 14px;
    background: var(--ck-green);
    color: #fff !important;
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.03em;
    text-decoration: none !important;
}

.ck-news-detail__cta:hover {
    background: var(--ck-green-dark, #007a0b);
    color: #fff !important;
}

.ck-news-related {
    padding: 8px 0 48px !important;
    background: #fff;
    border-top: 1px solid #eee;
}

.ck-news-related__title {
    margin: 0 0 22px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e5e5;
    font-family: var(--ck-font-heading);
    font-size: 22px;
    font-weight: 800;
    color: var(--ck-green);
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

@media (max-width: 991px) {
    .ck-news-detail__side {
        position: static;
        margin-top: 8px;
    }
    .ck-news-detail__title {
        font-size: 22px;
    }
}

@media (max-width: 575px) {
    .ck-news-detail__book {
        margin-left: 0;
        width: 100%;
        justify-content: center;
    }
}

/* ---- Contact page ---- */
.ck-contact-page section {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.ck-contact {
    padding: 4px 0 48px !important;
    background: #fff;
}

.ck-contact__title {
    margin: 0 0 32px;
    text-align: center;
    font-family: var(--ck-font-heading);
    font-size: 22px;
    font-weight: 800;
    color: var(--ck-green);
    letter-spacing: 0.03em;
    line-height: 1.35;
    text-transform: uppercase;
}

.ck-contact__office {
    margin-bottom: 40px;
}

.ck-contact__row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.ck-contact__col--map {
    flex: 0 0 38%;
    max-width: 38%;
}

.ck-contact__col--info {
    flex: 1 1 auto;
    min-width: 0;
    padding-top: 4px;
}

.ck-contact__col--qr {
    flex: 0 0 220px;
    max-width: 220px;
    text-align: center;
}

.ck-contact__map {
    width: 100%;
    height: 220px;
    border: 1px solid #ddd;
    overflow: hidden;
    background: #eef6ef;
}

.ck-contact__map iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.ck-contact__info {
    padding: 0;
}

.ck-contact__info h2 {
    margin: 0 0 14px;
    font-size: 17px;
    font-weight: 800;
    color: #111;
}

.ck-contact__info p {
    margin: 0 0 10px;
    font-size: 14px;
    color: #222;
    line-height: 1.55;
}

.ck-contact__info a {
    color: #222;
    text-decoration: none;
}

.ck-contact__info a:hover {
    color: var(--ck-green);
}

.ck-contact__qr-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: 4px;
}

.ck-contact__qr-label {
    margin: 14px 0 0;
    font-size: 14px;
    font-weight: 800;
    color: #111;
    letter-spacing: 0.01em;
    line-height: 1.35;
    text-align: left;
    text-transform: uppercase;
}

.ck-contact__qr {
    position: relative;
    display: inline-block;
    padding: 0;
    border: none;
    background: transparent;
}

.ck-contact__qr img:first-child {
    display: block;
    width: 168px;
    height: 168px;
}

.ck-contact__qr-badge {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 40px !important;
    height: 40px !important;
    transform: translate(-50%, -50%);
    border-radius: 8px;
    background: #fff;
    padding: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}

@media (max-width: 991px) {
    .ck-contact__row {
        flex-wrap: wrap;
    }
    .ck-contact__col--map {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .ck-contact__col--info {
        flex: 1 1 55%;
    }
    .ck-contact__col--qr {
        flex: 0 0 200px;
        max-width: 200px;
    }
    .ck-contact__map {
        height: 240px;
    }
}

@media (max-width: 575px) {
    .ck-contact__col--info,
    .ck-contact__col--qr {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .ck-contact__qr-block {
        align-items: flex-start;
        text-align: left;
        margin-top: 8px;
    }
    .ck-contact__title {
        font-size: 18px;
    }
}

/* ---- Price ---- */
.ck-price {
    padding: 48px 0;
    background: #fff;
}

.ck-price__img-wrap {
    max-width: 920px;
    margin: 0 auto;
}

.ck-price__img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* ---- Subpage (Giá vé, …) ---- */
.ck-subpage section {
    padding: 0 !important;
}

.ck-subpage__banner {
    /* Ảnh 1920×800 — giữ đúng tỷ lệ trên mọi màn */
    width: 100%;
    height: clamp(140px, calc(100vw * 800 / 1920), 800px);
    background: #0a4a6e url(/Content/images/phuqy/anhtau.webp?v=1) center center / cover no-repeat;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.ck-subpage__crumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 20px 0 32px;
    font-family: var(--ck-font-heading);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ck-subpage__crumb a {
    color: #888 !important;
    text-decoration: none !important;
}

.ck-subpage__crumb a:hover {
    color: var(--ck-green) !important;
}

.ck-subpage__crumb .is-current {
    color: var(--ck-green);
}

.ck-subpage__crumb-sep {
    color: #bbb;
    font-weight: 600;
}

.ck-price-page .ck-price {
    padding: 8px 0 64px;
    background: #fff;
}

.ck-price-page .ck-price__img-wrap {
    max-width: 960px;
    margin: 0 auto;
}

.ck-price-page .ck-price__img {
    border-radius: 0;
    box-shadow: none;
}

.ck-price__notes {
    list-style: none;
    display: block;
    max-width: 960px;
    margin: 80px auto 32px;
    padding: 0;
    color: #e31c23;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
}

.ck-price__notes li {
    display: block;
    width: 100%;
    float: none;
    clear: both;
    position: relative;
    padding-left: 22px;
    margin: 0;
}

.ck-price__notes li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #e31c23;
}

.ck-price__notes li + li {
    margin-top: 36px;
}

.ck-price-page .ck-cards-section {
    padding: 88px 0 64px;
    margin-top: 24px;
    border-top: 1px solid #e6e6e6;
    background: #fff;
}

.ck-price-page .ck-cards-section .ck-section-title {
    text-align: center;
    margin-bottom: 36px;
}

/* ---- Cards / explore ---- */
.ck-cards-section {
    padding: 48px 0 28px;
    background: #fff;
    border-top: 1px solid #e6e6e6;
}

.ck-cards-section .ck-section-title {
    text-align: left;
}

.ck-cards-section--cargo {
    padding-bottom: 56px;
    border-top: 1px solid #e6e6e6;
    background: #fff;
}

.ck-card {
    background: transparent;
    border-radius: 0;
    overflow: visible;
    margin-bottom: 28px;
    box-shadow: none;
    height: calc(100% - 28px);
}

.ck-card__link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none !important;
}

.ck-card__link:hover .ck-card__body h3 {
    color: var(--ck-green);
}

.ck-card__media {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: #e9f3ea;
    text-decoration: none !important;
}

.ck-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}

.ck-card:hover .ck-card__media img {
    transform: scale(1.04);
}

.ck-card__more {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.94);
    opacity: 0;
    background: var(--ck-green);
    color: #fff !important;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.06em;
    padding: 10px 22px;
    border-radius: 999px;
    text-decoration: none !important;
    white-space: nowrap;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
    box-shadow: 0 6px 16px rgba(0, 145, 13, 0.28);
}

.ck-card:hover .ck-card__more,
.ck-card__media:focus .ck-card__more,
.ck-cards-section .row > [class*="col-"]:first-child .ck-card__more {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

.ck-card__body {
    padding: 14px 2px 0;
}

.ck-card__body h3 {
    font-size: 17px;
    font-weight: 600;
    color: #222;
    margin: 0 0 8px;
    line-height: 1.45;
}

.ck-card__body h3 a {
    color: inherit;
    text-decoration: none;
}

.ck-card__body h3 a:hover {
    color: var(--ck-green);
}

.ck-card__body p {
    margin: 0;
    color: #555;
    font-size: 13px;
    line-height: 1.55;
}

.ck-card__more-inline {
    display: inline-block;
    margin-top: 8px;
    color: var(--ck-green) !important;
    font-weight: 800;
    text-decoration: none !important;
}

.ck-explore {
    padding: 40px 0 36px;
    background: #fff;
    border-top: 1px solid #e6e6e6;
}

.ck-cards-section--home-news {
    padding: 36px 0 56px;
    background: #fff;
}

.ck-cards-section--home-news .ck-section-title {
    text-align: left;
    margin-bottom: 28px;
}

.ck-explore__grid {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

.ck-explore__col {
    display: flex;
    margin-bottom: 24px;
}

.ck-explore__promo {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    text-decoration: none !important;
    color: inherit;
    background: #111;
    aspect-ratio: 4 / 3;
}

.ck-explore__promo-img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
}

.ck-explore__promo-art {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.ck-explore__cloud {
    position: absolute;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 999px;
    box-shadow: 18px 0 0 -2px rgba(255, 255, 255, 0.92), -16px 4px 0 -4px rgba(255, 255, 255, 0.85);
}

.ck-explore__cloud--1 {
    top: 18px;
    left: 28%;
    width: 70px;
    height: 22px;
}

.ck-explore__cloud--2 {
    top: 46px;
    right: 14%;
    width: 58px;
    height: 18px;
}

.ck-explore__hills {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 34%;
    display: block;
}

.ck-explore__promo-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 18px 16px 20px;
    box-sizing: border-box;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.04) 42%, rgba(0, 0, 0, 0.28) 100%);
}

.ck-explore__promo-title {
    margin: 0 0 10px;
    max-width: 100%;
    color: #fff !important;
    font-family: var(--ck-font-heading) !important;
    font-weight: 800 !important;
    font-size: 17px !important;
    line-height: 1.15 !important;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    -webkit-text-stroke: 1.4px #00910D;
    paint-order: stroke fill;
    text-shadow:
        -1px -1px 0 #00910D,
        1px -1px 0 #00910D,
        -1px 1px 0 #00910D,
        1px 1px 0 #00910D,
        0 2px 8px rgba(0, 0, 0, 0.35);
}

.ck-explore__promo-title span {
    display: block;
}

.ck-explore__promo-desc {
    margin: 0 0 14px;
    max-width: 100%;
    color: #fff;
    font-size: 13px;
    line-height: 1.55;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
}

.ck-explore__promo-btn {
    margin-top: auto;
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    color: #00910D !important;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.05em;
    padding: 10px 18px;
    border-radius: 999px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    transition: transform .2s ease, box-shadow .2s ease;
}

.ck-explore__promo:hover .ck-explore__promo-btn {
    transform: translateX(3px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.16);
}

.ck-explore .ck-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    margin-bottom: 0;
}

.ck-explore .ck-card__media {
    flex: 0 0 auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
}

.ck-explore .ck-card__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ck-explore .ck-card__body {
    flex: 0 0 auto;
    padding: 14px 2px 0;
}

/* ---- Responsive ---- */
@media (max-width: 1099px) {
    /* Hàng 1: logo + menu | Hàng 2: Tìm kiếm + Đặt vé trực tuyến */
    .ck-header__top-inner {
        flex-wrap: wrap;
        align-items: center;
        min-height: 0;
        gap: 8px 10px;
        padding-top: 8px;
        padding-bottom: 10px;
    }

    .ck-header__lang {
        display: none !important;
    }

    .ck-header .container {
        padding-left: 0 !important;
        padding-right: 8px;
    }

    .ck-header__logo {
        order: 1 !important;
        position: static !important;
        transform: none;
        left: auto;
        width: auto;
        flex: 0 0 auto !important;
        justify-content: flex-start;
        margin: 0 !important;
        padding: 0 !important;
    }

    .ck-header__logo img {
        height: 48px;
    }

    .ck-header__actions {
        order: 4;
        width: 100%;
        margin-left: 0;
        flex: 1 1 100%;
        display: flex;
        align-items: stretch;
        gap: 8px;
    }

    /* Hiện ô Tìm kiếm trên mobile — ngắn hơn nút Đặt vé */
    .ck-header__search {
        display: inline-flex !important;
        flex: 0 1 34%;
        max-width: 36%;
        min-width: 0;
    }

    .ck-header__search-btn {
        width: 100%;
        min-width: 0;
        height: 40px;
        padding: 0 10px;
        gap: 6px;
    }

    .ck-header__search-btn input {
        width: 100%;
        min-width: 0;
        height: 40px;
        font-size: 13px;
    }

    /* Hiện chữ ĐẶT VÉ TRỰC TUYẾN — dài hơn Tìm kiếm */
    .ck-header__book > span:not(.ck-header__book-ico) {
        display: inline !important;
    }

    .ck-header__book .ck-header__book-ico {
        display: block !important;
        width: 18px;
        height: 18px;
        flex: 0 0 18px;
    }

    .ck-header__book {
        flex: 1 1 62%;
        width: auto;
        min-width: 0;
        height: 40px;
        padding: 0 12px;
        border-radius: 999px;
        gap: 6px;
        font-size: 12px;
        letter-spacing: 0.02em;
        white-space: nowrap;
        text-align: center;
        line-height: 1.15;
    }

    /* Desktop green nav → menu hamburger trên tablet/mobile */
    .ck-header__nav {
        display: none !important;
    }

    .ck-header__nav .ck-nav.nav.navbar-nav,
    .ck-header__nav ul#responsive-menu {
        display: none !important;
    }

    .ck-header__mobile {
        display: contents !important;
    }

    .ck-header .slicknav_menu {
        display: contents;
    }

    .ck-header .slicknav_btn {
        order: 3;
        width: 44px;
        min-width: 44px;
        height: 44px;
        min-height: 44px;
        margin: 0 0 0 auto !important;
        padding: 0 !important;
        border-radius: 8px;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        float: none !important;
        position: relative;
        z-index: 2;
    }

    .ck-header .slicknav_nav {
        order: 5;
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        overflow-y: visible !important;
        margin: 4px 0 0 !important;
        padding: 4px 0 6px !important;
        clear: both !important;
    }

    .ck-header .slicknav_nav,
    .ck-header .slicknav_nav ul {
        overflow: visible !important;
    }

    .ck-header .slicknav_nav a {
        min-height: 44px;
        padding: 12px 8px;
        font-size: 16px;
        line-height: 1.45;
        color: #222 !important;
        background: transparent !important;
        text-transform: none !important;
        font-weight: 400 !important;
    }

    .ck-header .slicknav_nav a:hover,
    .ck-header .slicknav_nav a:focus,
    .ck-header .slicknav_nav li.active > a {
        color: #00910D !important;
        background: transparent !important;
    }

    .ck-header .slicknav_nav li.active > a {
        font-weight: 600 !important;
    }

    .ck-header .container {
        padding-left: 0 !important;
        padding-right: 8px;
    }

    .ck-booking {
        margin-top: 0;
        padding: 0 0 8px;
    }

    .ck-about__content {
        margin-bottom: 24px;
    }

    .ck-explore__promo {
        min-height: 0;
    }

    .ck-explore__promo-title {
        font-size: 16px !important;
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .ck-header .container {
        padding-left: 0 !important;
        padding-right: 8px !important;
    }

    .ck-header__lang {
        display: none !important;
    }

    .ck-header__logo {
        order: 1 !important;
        position: static !important;
        left: auto !important;
        transform: none !important;
        flex: 0 0 auto !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        justify-content: flex-start !important;
    }

    .ck-header__logo img {
        margin: 0 !important;
        padding: 0 !important;
        display: block;
    }

    .ck-header__actions {
        padding-left: 8px;
    }

    .ck-section-title {
        font-size: 22px !important;
    }

    .ck-booking__fields {
        flex-direction: column;
        align-items: stretch;
    }

    .ck-booking__field,
    .ck-booking__field--qty,
    .ck-booking__submit {
        width: 100%;
        flex: none;
    }

    .ck-booking__btn {
        width: 100%;
    }

    .ck-hero__media {
        height: auto;
    }

    .ck-hero__img,
    .ck-hero .home-hero-img {
        height: auto !important;
        object-fit: unset !important;
    }

    .ck-booking,
    body.page-home .home-search-bar {
        margin-top: -24px;
    }

    .ck-schedule__table thead {
        display: none;
    }

    .ck-schedule__table tr {
        display: block;
        padding: 12px 14px;
        border-top: 1px solid #eee;
    }

    .ck-schedule__table td {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        border: 0;
        padding: 6px 0;
    }

    .ck-schedule__table td::before {
        content: attr(data-label);
        font-weight: 700;
        color: var(--ck-green);
    }

    .ck-footer__company,
    .ck-footer__office,
    .ck-footer__line {
        white-space: normal !important;
        font-size: 13px;
    }

    .ck-float {
        right: 10px;
        bottom: 16px;
    }

    .ck-float__btn {
        width: 44px;
        height: 44px;
    }

    .ck-explore__promo {
        min-height: 0;
    }

    .ck-explore__promo-content {
        padding: 16px 14px 18px;
    }

    .ck-explore__promo-title {
        font-size: 18px !important;
        max-width: 100%;
    }

    .ck-explore .ck-card__media {
        min-height: 0;
        aspect-ratio: 4 / 3;
    }

    .ck-cards-section .row > [class*="col-"]:first-child .ck-card__more {
        opacity: 0;
    }

    .ck-card:hover .ck-card__more {
        opacity: 1;
    }

    /* Home booking form — tránh zoom iOS, nút dễ bấm */
    .ck-booking__tabs {
        margin-left: 12px;
        max-width: calc(100% - 24px);
    }

    .ck-booking__tab {
        padding: 12px 18px;
        font-size: 13px;
        min-height: 44px;
    }

    .ck-booking__input,
    .ck-booking #dGo,
    .ck-booking #dRoundGo,
    .ck-booking__qty-input,
    .ck-booking #numCus {
        font-size: 16px !important;
    }

    .ck-booking__route-btn,
    .ck-booking__row {
        min-height: 48px;
    }

    .ck-booking__menu {
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
    }

    .ck-booking,
    body.page-home .home-search-bar {
        margin-top: -16px;
        padding-left: 10px;
        padding-right: 10px;
    }

    /* Lịch tàu home */
    .ck-schedule {
        padding: 28px 0 36px;
    }

    .ck-date-strip__item {
        min-width: 72px;
        min-height: 48px;
        padding: 10px 8px;
    }

    .ck-date-scroll {
        height: 8px;
        min-height: 8px;
    }

    .ck-schedule__book {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        padding: 10px 16px;
    }

    .ck-schedule__table td {
        flex-wrap: wrap;
        gap: 4px 8px;
    }

    .ck-schedule-page .ck-schedule {
        padding: 8px 0 28px !important;
    }

    .ck-schedule-page .ck-subpage__crumb {
        padding: 12px 0 16px;
        font-size: 13px;
    }
}

/* ========== /dat-ve/chon-chuyen — chọn chuyến ========== */
body.page-chon-chuyen,
body.page-map-seat {
    --ck-pick-green: #00910D;
    --ck-pick-green-deep: #007a0b;
    --ck-pick-gold: #FFD200;
}

.ck-pick {
    background: #fff;
    padding: 36px 0 56px;
    min-height: 52vh;
}

.ck-pick__steps {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    max-width: 760px;
    margin: 0 auto 36px;
    padding: 4px 8px 0;
}

.ck-pick__step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    flex: 0 0 108px;
    width: 108px;
    color: #bdbdbd;
    text-align: center;
}

.ck-pick__step-ico {
    width: 58px;
    height: 58px;
    min-width: 58px;
    min-height: 58px;
    border: 0;
    border-radius: 50%;
    background: #eeeeee;
    box-shadow: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
}

.ck-pick__step-ico img {
    position: static;
    width: 48px;
    height: 48px;
    max-width: 48px;
    opacity: 1;
    object-fit: contain;
    display: block;
    filter: grayscale(1) brightness(0.65);
}

.ck-pick__step-txt {
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1.25;
    min-height: 2.4em;
    color: inherit;
}

.ck-pick__step-line {
    flex: 1 1 0;
    height: 2px;
    background: #e4e4e4;
    margin: 28px 8px 0;
    min-width: 16px;
    align-self: flex-start;
}

.ck-pick__step.is-active {
    color: #00910D;
}

.ck-pick__step.is-active .ck-pick__step-ico {
    background: #00910D;
    box-shadow: 0 0 0 4px rgba(0, 145, 13, 0.18);
}

.ck-pick__step.is-active .ck-pick__step-ico img {
    filter: brightness(0) invert(1);
}

.ck-pick__step.is-active + .ck-pick__step-line {
    background: linear-gradient(90deg, #8ed48a 0%, #e4e4e4 100%);
}

.ck-pick__dates {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 8px;
    overflow-x: auto;
    padding: 4px 0 18px;
    margin: 0 auto 28px;
    max-width: 920px;
    width: 100%;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.ck-pick__dates::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 6px;
    height: 3px;
    background: #e6e6e6;
    border-radius: 2px;
    pointer-events: none;
}

.ck-pick__day {
    appearance: none;
    position: relative;
    z-index: 1;
    flex: 0 0 102px;
    width: 102px;
    height: 42px;
    box-sizing: border-box;
    border: 1px solid #e0e0e0;
    background: #fff;
    color: #555;
    border-radius: 8px;
    padding: 0;
    font-family: var(--ck-font-heading);
    font-weight: 700;
    font-size: 13px;
    line-height: 40px;
    text-align: center;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.ck-pick__day.is-active {
    background: var(--ck-pick-green);
    border-color: var(--ck-pick-green);
    color: #fff;
}

.ck-pick__day.is-active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -15px;
    height: 3px;
    background: var(--ck-pick-green);
    border-radius: 2px;
    z-index: 2;
}

.ck-pick__hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0);
    opacity: 0 !important;
    pointer-events: none !important;
}

.ck-pick__lists {
    max-width: 920px;
    width: 100%;
    margin: 0 auto;
}

.ck-pick__block-title {
    display: none;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 16px;
    color: var(--ck-pick-green);
    margin: 0 0 14px;
    text-transform: uppercase;
}

.ck-pick .ck-pick__block-title--go,
body.page-chon-chuyen .ck-pick__block-title--go,
.ck-pick--round .ck-pick__block-title--return,
body.page-chon-chuyen #lstRoundGo .ck-pick__block-title--return {
    display: block;
}

.ck-pick--round #lstRoundGo,
body.page-chon-chuyen #lstRoundGo {
    margin-top: 36px;
}

body.page-chon-chuyen .ck-pick .ck-pick__item.table-row {
    display: block !important;
    padding: 0 !important;
    margin-bottom: 14px;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page-chon-chuyen .ck-pick .ck-pick__empty.table-row {
    display: block !important;
    padding: 40px 16px !important;
}

.ck-pick__ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.ck-pick__item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    clear: both;
    float: none !important;
    width: 100%;
    border: 0 !important;
    cursor: pointer;
}

/* 5 khối ngang: ngày | đi | icon | đến | ghế — chữ căn giữa từng cột */
.ck-pick__card {
    display: grid;
    grid-template-columns: 1fr 1.2fr minmax(140px, 1.1fr) 1.2fr 1fr;
    align-items: center;
    justify-items: center;
    column-gap: 8px;
    background: var(--ck-pick-green);
    color: #fff;
    border-radius: 12px;
    padding: 18px 18px;
    min-height: 108px;
    box-shadow: 0 10px 28px rgba(0, 145, 13, 0.22);
    position: relative;
    transition: box-shadow .15s ease, transform .15s ease;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
}

.ck-pick__item.is-selected .ck-pick__card {
    box-shadow: 0 12px 32px rgba(0, 100, 10, 0.35);
    outline: 3px solid rgba(255, 255, 255, 0.28);
}

/* Nhỏ nhất: NHÃN (NGÀY KHỞI HÀNH / GHẾ TRỐNG) */
.ck-pick__label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #fff;
    opacity: 1;
    margin-bottom: 4px;
    line-height: 1.25;
}

/* Tầng 2: ngày + ghế trống (vàng) */
.ck-pick__date-val,
.ck-pick__seats-val {
    display: block;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 22px;
    line-height: 1.15;
    color: var(--ck-pick-gold);
}

.ck-pick__date,
.ck-pick__seats {
    min-width: 0;
    text-align: center;
    justify-self: center;
}

/* Bỏ wrapper grid route — chuyển thành 3 cột trong card grid */
.ck-pick__route {
    display: contents;
}

.ck-pick__end {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    min-width: 0;
    text-align: center;
}

.ck-pick__end--to {
    text-align: center;
    align-items: center;
}

.ck-pick__time-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
}

.ck-pick__end--to .ck-pick__time-row {
    align-items: center;
}

/* Lớn nhất: GIỜ */
.ck-pick__time {
    font-size: 28px;
    font-weight: 800;
    line-height: 1.05;
    color: #fff;
    letter-spacing: 0.01em;
}

/* Nhỏ: Khởi hành / Cập bến (vàng) */
.ck-pick__hint {
    font-size: 12px;
    font-weight: 600;
    color: var(--ck-pick-gold);
    opacity: 1;
    line-height: 1.2;
}

/* Tầng 2: tên nơi */
.ck-pick__city {
    display: block;
    margin-top: 2px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.2;
}

.ck-pick__mid {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: stretch;
    width: 100%;
    min-width: 0;
    color: #fff;
    padding: 0 4px;
}

/* ←── tàu ──→ kéo dài hai bên (dãn ngang) */
.ck-pick__rail {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 160px;
    height: 36px;
}

.ck-pick__rail::before {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    top: 50%;
    height: 2px;
    margin-top: -1px;
    background: #fff;
    z-index: 0;
}

.ck-pick__rail::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 46px;
    height: 36px;
    margin: -18px 0 0 -23px;
    background: var(--ck-pick-green);
    z-index: 1;
}

.ck-pick__arr {
    position: absolute;
    top: 50%;
    width: 0;
    height: 0;
    z-index: 1;
    font-size: 0;
    line-height: 0;
}

.ck-pick__arr--l {
    left: 0;
    margin-top: -5px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 10px solid #fff;
}

.ck-pick__arr--r {
    right: 0;
    margin-top: -5px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 10px solid #fff;
}

.ck-pick__ship {
    position: relative;
    z-index: 2;
    display: inline-block;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    /* Icon 1.png nền đen + tàu xanh → mask luminance để hiện silhouette trắng */
    background-color: #fff;
    -webkit-mask-image: url("/Content/images/icons/1.png?v=3");
    mask-image: url("/Content/images/icons/1.png?v=3");
    -webkit-mask-mode: luminance;
    mask-mode: luminance;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.ck-pick__line {
    display: none;
}

.ck-pick__radio-wrap {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    opacity: 0;
}

.ck-pick__book {
    display: none !important;
}

.ck-pick__block .ck-pick__dates {
    margin: 0 0 18px;
    max-width: none;
}

.ck-pick__item.is-selected .ck-pick__card {
    box-shadow: 0 0 0 3px var(--ck-pick-gold, #FFD200), 0 10px 28px rgba(0, 145, 13, 0.22);
}

.ck-pick__item.is-selected .ck-pick__book {
    background: var(--ck-pick-green-deep, #007a0b);
}

.ck-pick__footer {
    max-width: 920px;
    width: 100%;
    margin: 28px auto 0;
}

.ck-pick__submit {
    appearance: none;
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 0;
    border-radius: 12px;
    min-height: 56px;
    background: var(--ck-pick-green, #00910D);
    color: #fff;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 18px;
    letter-spacing: 0.08em;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(0, 145, 13, 0.2);
}

.ck-pick__submit:disabled {
    background: #cfcfcf;
    box-shadow: none;
    cursor: not-allowed;
    color: #fff;
}

.ck-pick__submit.is-ready:not(:disabled):hover {
    background: var(--ck-pick-green-deep, #007a0b);
}

.ck-pick__empty {
    text-align: center;
    padding: 40px 16px;
    color: #666;
    font-size: 16px;
    list-style: none;
}

/* Mobile/tablet: card chuyến 1 hàng ngang — ghi đè page-booking .table-row xếp dọc */
@media (max-width: 900px) {
    body.page-booking.page-chon-chuyen .ck-pick .responsive-table .table-row.ck-pick__item,
    body.page-chon-chuyen .ck-pick .ck-pick__item.table-row,
    .ck-pick .ck-pick__item.table-row {
        display: block !important;
        flex-direction: unset !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
        margin: 0 0 14px 0 !important;
        text-align: center !important;
    }

    body.page-booking.page-chon-chuyen .ck-pick .ck-pick__card,
    body.page-chon-chuyen .ck-pick__card,
    .ck-pick__card {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 4px;
        grid-template-columns: none !important;
        width: 100%;
        min-height: 0;
        padding: 10px 6px !important;
        box-sizing: border-box;
        overflow: hidden;
    }

    /* Không dùng display:contents trên mobile (Safari dễ vỡ layout) */
    body.page-chon-chuyen .ck-pick__route,
    .ck-pick__route {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 1 1 auto;
        min-width: 0;
        gap: 2px;
    }

    .ck-pick__date,
    .ck-pick__seats {
        flex: 0 0 auto;
        max-width: 22%;
        min-width: 0;
        text-align: center;
        padding: 0 2px;
    }

    .ck-pick__end,
    .ck-pick__end--to {
        flex: 1 1 0;
        min-width: 0;
        text-align: center;
        align-items: center;
        gap: 0;
    }

    .ck-pick__mid {
        flex: 0 0 auto;
        min-width: 0;
        padding: 0 2px;
        width: auto;
        justify-self: center;
    }

    .ck-pick__time-row {
        align-items: center;
        gap: 0;
    }

    .ck-pick__label {
        font-size: 7px !important;
        letter-spacing: 0;
        margin-bottom: 1px;
        white-space: nowrap !important;
        line-height: 1.1;
    }

    .ck-pick__date-val,
    .ck-pick__seats-val {
        font-size: 11px !important;
        white-space: nowrap !important;
        line-height: 1.15;
    }

    .ck-pick__time {
        font-size: 13px !important;
        white-space: nowrap !important;
        line-height: 1.1;
    }

    .ck-pick__hint {
        font-size: 8px !important;
        white-space: nowrap !important;
        line-height: 1.1;
    }

    .ck-pick__city {
        font-size: 9px !important;
        margin-top: 0;
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
        line-height: 1.15;
    }

    .ck-pick__rail {
        max-width: 48px;
        width: 48px;
        height: 22px;
    }

    .ck-pick__rail::before {
        left: 8px;
        right: 8px;
    }

    .ck-pick__rail::after {
        width: 26px;
        height: 20px;
        margin-left: -13px;
        margin-top: -10px;
    }

    .ck-pick__ship {
        width: 20px !important;
        height: 20px !important;
        flex: 0 0 20px !important;
    }

    .ck-pick__arr--l {
        border-right-width: 6px;
        border-top-width: 3px;
        border-bottom-width: 3px;
        margin-top: -3px;
    }

    .ck-pick__arr--r {
        border-left-width: 6px;
        border-top-width: 3px;
        border-bottom-width: 3px;
        margin-top: -3px;
    }
}

@media (max-width: 767px) {
    .ck-pick {
        padding: 24px 0 40px;
    }

    .ck-pick__steps {
        max-width: 100%;
        overflow-x: auto;
        justify-content: flex-start;
        padding-bottom: 8px;
    }

    .ck-pick__step {
        width: 96px;
        flex-basis: 96px;
    }

    .ck-pick__step-ico {
        width: 50px;
        height: 50px;
        min-width: 50px;
        min-height: 50px;
    }

    .ck-pick__step-ico img {
        width: 48px;
        height: 48px;
        max-width: 48px;
    }

    .ck-pick__step-line {
        margin: 24px 6px 0;
    }

    .ck-pick__step-txt {
        font-size: 11px;
    }

    .ck-pick .container {
        padding-left: 8px;
        padding-right: 8px;
    }

    .ck-pick__day {
        flex-basis: 88px;
        width: 88px;
        height: 48px;
        line-height: 46px;
        font-size: 12px;
    }

    body.page-chon-chuyen .ck-pick__card,
    .ck-pick__card {
        padding: 8px 4px !important;
        gap: 2px;
        border-radius: 10px;
    }

    .ck-pick__date-val,
    .ck-pick__seats-val {
        font-size: 10px !important;
    }

    .ck-pick__time {
        font-size: 12px !important;
    }

    .ck-pick__city {
        font-size: 8px !important;
    }

    .ck-pick__label {
        font-size: 6px !important;
    }

    .ck-pick__hint {
        font-size: 7px !important;
    }

    .ck-pick__rail {
        max-width: 40px;
        width: 40px;
        height: 20px;
    }

    .ck-pick__ship {
        width: 18px !important;
        height: 18px !important;
        flex: 0 0 18px !important;
    }
}

/* ========== /so-do-ghe — sơ đồ ghế + HKH ========== */
.ck-seat {
    background: #fff;
    padding: 24px 0 48px;
    min-height: 60vh;
}

.ck-seat .container {
    max-width: 1240px;
}

.ck-seat .ck-pick__steps {
    margin: 0 auto 48px;
    max-width: 760px;
}

.ck-seat__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 1fr);
    gap: 22px 20px;
    align-items: start;
}

.ck-seat__map-panel {
    border: 1px solid #e2e2e2;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    min-width: 0;
}

.ck-seat__panel-head {
    margin: 0;
    padding: 11px 14px;
    background: #00910D;
    color: #fff;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 15px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.ck-seat__legend {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px 14px !important;
    padding: 10px 12px;
    margin: 0;
    background: #fff;
    border-bottom: 1px solid #ececec;
    grid-template-columns: none !important;
}

.ck-seat__legend .note-col {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    float: none;
    width: auto;
}

.ck-seat__legend .note-swatch {
    width: 14px;
    height: 14px;
    min-width: 14px;
    border-radius: 2px;
    display: inline-block;
}

.ck-seat__legend .note-label {
    margin: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #444;
    white-space: nowrap;
}

.ck-seat__scroll {
    width: 100%;
    overflow: hidden;
    padding: 12px 8px 14px;
    background: #fff;
    min-height: 200px;
    box-sizing: border-box;
}

.ck-seat__scroll .list-seat {
    max-width: none !important;
    transform-origin: top left;
    will-change: transform;
}

.ck-seat__totals {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 28px;
    align-items: center;
    justify-content: flex-start;
    padding: 12px 16px;
    margin: 0 10px 12px;
    border: 2px solid #00910D;
    border-radius: 4px;
    background: #eef9ef;
}

.ck-seat__total-item {
    font-family: var(--ck-font-heading);
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #1a1a1a;
}

.ck-seat__total-item strong {
    font-size: 16px;
    font-weight: 800;
    color: #00910D;
    margin-left: 4px;
}

.ck-seat__side {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.ck-seat__block {
    background: #fff;
}

.ck-seat__h {
    margin: 0 0 12px;
    padding: 0;
    color: #00910D;
    font-family: var(--ck-font-heading);
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ck-seat__h .fa {
    font-size: 15px;
}

.ck-seat__block--trip {
    border-top: 3px solid #00910D;
    padding-top: 10px;
}

.ck-seat__block--trip .ck-seat__h {
    margin-bottom: 8px;
}

.ck-seat__trip {
    padding: 0;
    font-size: 13px;
    line-height: 1.35;
    color: #222;
}

.ck-seat__trip-route {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 700;
    color: #1a1a1a;
}

.ck-seat__trip-route .fa-ship {
    color: #00910D;
    font-size: 15px;
}

.ck-seat__trip-meta {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 8px 16px;
    align-items: start;
}

.ck-seat__trip-col {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ck-seat__trip-label {
    font-size: 12px;
    font-weight: 500;
    color: #666;
}

.ck-seat__trip-val {
    font-size: 13px;
    font-weight: 800;
    color: #1a1a1a;
    word-break: break-word;
}

#total_ticket {
    letter-spacing: 0.2px;
    color: #1a1a1a;
}

.ck-seat__trip-line {
    margin: 0 0 4px;
}

.ck-seat__trip-line strong {
    font-weight: 800;
}

.ck-seat__trip-seats {
    color: #00910D;
    font-weight: 800;
    letter-spacing: 0.03em;
}

.ck-seat__form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 0;
}

.ck-seat__form--invoice {
    padding: 12px;
    background: #fff;
}

.ck-seat__form--pax {
    padding: 14px 14px 10px;
    grid-template-columns: 1fr 1fr;
    gap: 12px 18px;
}

.ck-seat__form--uline .ck-seat__field label {
    color: #9e9e9e;
    margin-bottom: 2px;
}

.ck-seat__form--pax.ck-seat__form--uline .ck-seat__field label {
    color: #9e9e9e;
}

.ck-seat__form--uline .ck-seat__field.is-filled label,
.ck-seat__form--pax.ck-seat__form--uline .ck-seat__field.is-filled label,
.ck-seat__booker .ck-seat__field.is-filled label {
    color: #00910D !important;
}

.ck-seat__form--uline .form-control.ck-seat__u-input,
.ck-seat__form--uline .ck-seat__u-input {
    width: 100%;
    border: 0 !important;
    border-bottom: 1px solid #cfcfcf !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    background: transparent !important;
    padding: 4px 0 6px !important;
    min-height: 30px;
    height: auto !important;
    font-size: 14px;
    font-weight: 400;
    color: #9e9e9e;
    text-transform: none;
    appearance: none;
    -webkit-appearance: none;
}

.ck-seat__form--uline .ck-seat__u-input.is-filled,
.ck-seat__form--pax.ck-seat__form--uline .ck-seat__u-input.is-filled,
.ck-seat__booker.ck-seat__form--uline .ck-seat__u-input.is-filled,
.ck-seat__booker .ck-seat__u-input:not(:placeholder-shown) {
    color: #111 !important;
    font-weight: 700 !important;
}

.ck-seat__booker .ck-seat__field:has(.ck-seat__u-input:not(:placeholder-shown)) label {
    color: #00910D !important;
}

.ck-seat__form--uline .ck-seat__u-input::placeholder {
    color: #9e9e9e;
    font-weight: 400;
    opacity: 1;
}

.ck-seat__form--uline select.ck-seat__u-input {
    cursor: pointer;
    background-image: linear-gradient(45deg, transparent 50%, #666 50%), linear-gradient(135deg, #666 50%, transparent 50%) !important;
    background-position: calc(100% - 12px) calc(50% + 2px), calc(100% - 7px) calc(50% + 2px) !important;
    background-size: 5px 5px, 5px 5px !important;
    background-repeat: no-repeat !important;
    padding-right: 22px !important;
}

.ck-seat__form--uline .ck-seat__u-input:focus {
    border-bottom-color: #00910D !important;
    border-bottom-width: 2px !important;
}

.ck-seat__form--uline .ck-seat__field.is-filled .ck-seat__u-input,
.ck-seat__form--uline .ck-seat__field.is-filled .ck-seat__u-input:focus,
.ck-seat__form--pax.ck-seat__form--uline .ck-seat__field.is-filled .ck-seat__u-input,
.ck-seat__form--pax.ck-seat__form--uline .ck-seat__field.is-filled .ck-seat__u-input:focus {
    border-bottom-color: #00910D !important;
    border-bottom-width: 2px !important;
}

.ck-seat__form--uline input[type="date"].ck-seat__u-input {
    text-transform: none;
    font-weight: 400;
}

.ck-seat__field label {
    display: block;
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #00910D;
}

.ck-seat__field .form-control {
    border-radius: 3px;
    border: 1px solid #cfcfcf;
    box-shadow: none !important;
    height: 36px;
    background: #fff;
}

.ck-seat__field--soft label {
    color: #666;
}

.ck-seat__check {
    grid-column: 1 / -1;
    padding-top: 2px;
    font-size: 13px;
    color: #333;
}

.ck-seat__check--quiet {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
}

.ck-seat__invoice {
    display: none !important;
    margin: 0 0 14px;
    border: 2px solid #E53935;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}

.ck-seat__invoice.is-open {
    display: block !important;
}

.ck-seat__invoice-head {
    margin: 0;
    padding: 10px 14px;
    background: #E53935;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ck-seat__u-field.is-accent label {
    color: #9e9e9e;
    font-weight: 600;
}

.ck-seat__u-field.is-accent .ck-seat__u-input,
.ck-seat__u-field.is-accent .ck-seat__u-input:focus {
    border-bottom-color: #E53935 !important;
    border-bottom-width: 2px !important;
}

.ck-seat__pax {
    border: 1.5px solid #00910D;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}

.ck-seat__pax-remove {
    appearance: none;
    border: 0;
    background: #E53935;
    color: #fff !important;
    font-size: 16px;
    line-height: 1;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    cursor: pointer;
    font-weight: 700;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ck-seat__pax-remove:hover {
    background: #c62828;
    color: #fff;
}

.ck-seat__pax-headbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: nowrap;
    margin-bottom: 12px;
}

.ck-seat__pax-headbar .ck-seat__h {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
}

.ck-seat__inv-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.ck-seat__inv-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #E53935;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
}

.ck-seat__inv-check input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    margin: 0;
    border: 2px solid #E53935;
    border-radius: 2px;
    background: #fff;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
}

.ck-seat__inv-check input[type="checkbox"]:checked {
    background: #E53935;
}

.ck-seat__inv-check input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.ck-seat__inv-btns {
    display: none;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.ck-seat__inv-btns.is-on {
    display: inline-flex;
}

.ck-seat__btn {
    appearance: none;
    border: 0;
    border-radius: 3px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1.2;
}

.ck-seat__btn--dl {
    background: #1e88e5;
}

.ck-seat__btn--import {
    background: #00910D;
}

.ck-seat__inv-form {
    padding: 10px 12px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ck-seat__inv-row--2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
}

.ck-seat__u-field label {
    display: block;
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #8a8a8a;
}

.ck-seat__u-input {
    width: 100%;
    border: 0 !important;
    border-bottom: 1px solid #cfcfcf !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    background: transparent !important;
    padding: 0 0 2px !important;
    height: 22px;
    min-height: 22px;
    max-height: 22px;
    line-height: 22px;
    font-size: 13px;
    font-weight: 700;
    color: #222;
    text-transform: none;
    box-sizing: border-box;
}

.ck-seat__pax-dir {
    margin: 4px 0 0;
    padding: 0;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #00910D;
}

.ck-seat__pax-dir + .ck-seat__pax {
    margin-top: 0;
}

.ck-seat__pax-list .ck-seat__pax-dir:not(:first-child) {
    margin-top: 10px;
}

.ck-seat__pax-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ck-seat__pax-empty {
    margin: 4px 0 0;
    padding: 14px 12px;
    color: #666;
    font-size: 13px;
    line-height: 1.45;
    background: #f7f7f7;
    border: 1px dashed #ddd;
    border-radius: 4px;
}

.ck-seat__pax-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    background: #00910D;
    color: #fff;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ck-seat__pax-head em {
    font-style: normal;
    opacity: 0.85;
    margin: 0 4px;
}

.ck-seat__pax-head b {
    font-weight: 800;
}

.ck-seat__notes-wrap {
    padding-top: 2px;
}

.ck-seat__notes-title {
    margin: 0 0 8px;
    color: #E53935;
    font-size: 14px;
    font-weight: 800;
}

.ck-seat__notes {
    margin: 0;
    padding: 0 0 0 18px;
    color: #222;
    font-size: 12.5px;
    line-height: 1.55;
    list-style: disc;
}

.ck-seat__notes li {
    margin-bottom: 6px;
}

.ck-seat__notes li:last-child {
    margin-bottom: 0;
}

.ck-seat__notes-warn {
    color: #E53935;
    font-weight: 800;
}

.ck-seat__continue {
    width: 100% !important;
    border: 0 !important;
    border-radius: 4px !important;
    min-height: 48px;
    background: #00910D !important;
    color: #fff !important;
    font-family: var(--ck-font-heading);
    font-weight: 800 !important;
    font-size: 15px !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
}

.ck-seat__continue:hover {
    background: #007a0b !important;
}

.ck-pick__step.is-done {
    color: #00910D;
}

.ck-pick__step.is-done .ck-pick__step-ico {
    background: #00910D;
    box-shadow: 0 0 0 4px rgba(0, 145, 13, 0.18);
}

.ck-pick__step.is-done .ck-pick__step-ico img {
    filter: brightness(0) invert(1);
}

.ck-pick__step-line.is-done,
.ck-pick__step.is-done + .ck-pick__step-line {
    background: #8ed48a;
}

.required-star {
    color: #c62828;
}

@media (max-width: 991px) {
    .ck-seat__grid {
        grid-template-columns: 1fr;
    }

    .ck-seat__form--pax {
        grid-template-columns: 1fr;
    }

    .ck-seat__inv-row--2 {
        grid-template-columns: 1fr;
    }

    .ck-seat__scroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 767px) {
    .ck-seat {
        padding: 16px 0 32px;
    }

    .ck-seat .container {
        padding-left: 12px;
        padding-right: 12px;
        overflow-x: hidden;
    }

    .ck-seat .ck-pick__steps {
        overflow-x: auto;
        justify-content: flex-start;
        max-width: 100%;
    }

    .ck-seat__scroll {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        padding: 8px 4px;
    }

    .ck-seat__trip-meta {
        grid-template-columns: 1fr;
    }

    .ck-seat__totals {
        flex-direction: column;
        align-items: stretch;
        margin: 8px;
    }

    .ck-seat__legend .note-label {
        font-size: 11px;
        white-space: normal;
    }

    .ck-seat__inv-check {
        white-space: normal;
        min-height: 44px;
    }

    .ck-seat__btn,
    .ck-seat__continue {
        min-height: 44px;
        padding: 10px 14px;
        font-size: 15px;
    }
}


/* ===== Confirm payment /xac-nhan-thanh-toan ===== */
.ck-pay {
    background: #fff;
    padding: 6px 0 20px;
    min-height: 50vh;
}

.ck-pay .container {
    max-width: 980px;
}

/* style.css: section{padding:4.5rem 0 5rem} — reset trên trang confirm */
.ck-pay section,
.ck-pay .ck-pay__block {
    padding: 0 !important;
}

.ck-pay .ck-pick__steps {
    margin: 0 auto 48px;
    max-width: 820px;
    padding: 0;
}

.ck-pay .ck-pick__step {
    gap: 4px;
}

.ck-pay .ck-pick__step-ico {
    width: 58px;
    height: 58px;
    min-width: 58px;
    min-height: 58px;
}

.ck-pay .ck-pick__step-txt {
    min-height: 0;
    font-size: 11px;
    line-height: 1.2;
}

.ck-pay .ck-pick__step-line {
    margin: 28px 8px 0;
}

.ck-pay__block {
    margin: 0 0 3px;
}

.ck-pay__block--tight {
    margin-bottom: 3px;
}

.ck-pay__block--tight .ck-pay__h {
    margin-bottom: 3px;
}

.ck-pay__block--tight.ck-pay__block--invoice {
    margin-bottom: 3px;
}

.ck-pay__h {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    color: #00910D;
    font-family: var(--ck-font-heading);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ck-pay__h .fa {
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 18px;
    color: #00910D;
    flex: 0 0 18px;
}

.ck-pay__h-ico {
    display: inline-block;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    background: #00910D;
    -webkit-mask: url("/Content/images/iconban/10.png") center / 180% no-repeat;
    mask: url("/Content/images/iconban/10.png") center / 180% no-repeat;
}

.ck-pay__h--pay .fa {
    font-size: 18px;
}

.ck-pay__trip {
    border-top: none;
    padding-top: 0;
}

.ck-pay__trip-route {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    font-size: 14px;
    font-weight: 700;
    color: #1a1a1a;
}

.ck-pay__trip-route .fa-ship {
    color: #00910D;
    font-size: 15px;
}

.ck-pay__trip-meta {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 10px 24px;
}

.ck-pay__trip-label {
    display: block;
    font-size: 12px;
    color: #666;
    margin-bottom: 3px;
}

.ck-pay__trip-val {
    font-size: 14px;
    font-weight: 800;
    color: #1a1a1a;
}

.ck-pay__booker {
    border: 1px solid #00910D;
    border-radius: 4px;
    padding: 10px 12px;
    background: #fff;
}

.ck-pay__booker-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 20px;
}

.ck-pay__booker-grid--3 {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px 16px;
}

.ck-pay__booker-email {
    grid-column: 1 / -1;
}

/* Invoice — khối đỏ như mock */
.ck-pay__invoice {
    border: 1px solid #E53935;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}

.ck-pay__invoice-head {
    margin: 0;
    padding: 9px 14px;
    background: #E53935;
    color: #fff;
    font-family: var(--ck-font-heading);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ck-pay__invoice-body {
    padding: 10px 12px 11px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ck-pay__invoice-row--2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 20px;
}

.ck-pay__invoice-field {
    min-width: 0;
}

.ck-pay__k {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #888;
    margin-bottom: 3px;
}

.ck-pay__v {
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: #222;
    text-transform: uppercase;
    word-break: break-word;
    line-height: 1.35;
}

.ck-pay__v--plain {
    text-transform: none;
    font-weight: 700;
}

.ck-pay__ticket-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.ck-pay__ticket-head .ck-pay__h {
    margin: 0;
}

.ck-pay__h--badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    background: none;
    color: #00910D;
    border-radius: 0;
    font-size: 15px;
}

.ck-pay__h--badge .fa {
    color: #00910D;
    font-size: 18px;
}

.ck-pay__total {
    font-size: 14px;
    font-weight: 700;
    color: #E53935;
    text-transform: uppercase;
    white-space: nowrap;
}

.ck-pay__total strong {
    font-weight: 800;
}

.ck-pay__tickets {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ck-pay__ticket {
    border: 1px solid #00910D;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
}

.ck-pay__ticket-bar {
    padding: 9px 12px;
    background: #00910D;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.ck-pay__ticket-bar em {
    font-style: normal;
    opacity: 0.85;
    margin: 0 4px;
}

.ck-pay__ticket-body {
    padding: 9px 12px 10px;
}

.ck-pay__ticket-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.ck-pay__ticket-table td {
    width: 33.333%;
    padding: 0 10px 0 0;
    vertical-align: top;
    border: none;
}

.ck-pay__ticket-table tr.ck-pay__ticket-table__sep td {
    padding: 0;
    height: 1px;
    line-height: 0;
}

.ck-pay__ticket-table tr.ck-pay__ticket-table__sep td span {
    display: block;
    height: 1px;
    background: #00910D;
    opacity: 0.45;
    margin: 6px 0;
}

.ck-pay__ticket-table tr.ck-pay__ticket-table__row2 td {
    padding-top: 2px;
}

.ck-pay__ticket-line {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #222;
    text-transform: uppercase;
    line-height: 1.45;
    word-break: break-word;
}

.ck-pay__ticket-line strong {
    font-weight: 800;
}

.ck-pay__methods {
    border: 1px solid #cfd8cf;
    border-radius: 4px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ck-pay__method {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: #222;
    cursor: pointer;
}

.ck-pay__method input {
    width: 16px;
    height: 16px;
    accent-color: #00910D;
    flex-shrink: 0;
}

.ck-pay__terms {
    max-height: 140px;
    overflow-y: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 12px 14px;
    background: #fafafa;
    font-size: 12.5px;
    line-height: 1.55;
    color: #333;
    margin-bottom: 12px;
}

.ck-pay__terms h4 {
    margin: 12px 0 6px;
    font-size: 13px;
    font-weight: 800;
    color: #222;
    line-height: 1.35;
}

.ck-pay__terms h4:first-child {
    margin-top: 0;
}

.ck-pay__terms p {
    margin: 0 0 8px;
}

.ck-pay__terms p:last-child {
    margin-bottom: 0;
}

.ck-pay__terms a {
    color: #00910D;
    font-weight: 700;
}

.ck-pay__agree {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 10px;
    font-size: 12.5px;
    color: #333;
    cursor: pointer;
    line-height: 1.45;
}

.ck-pay__agree.is-locked {
    opacity: 0.55;
    cursor: not-allowed;
}

.ck-pay__agree.is-locked input {
    cursor: not-allowed;
    pointer-events: none;
}

.ck-pay__terms-hint {
    margin: -6px 0 10px;
    font-size: 12px;
    color: #888;
    line-height: 1.4;
}

.ck-pay__terms-hint.is-hidden {
    display: none;
}

.ck-pay__warn {
    margin: 0;
    color: #E53935;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
}

.ck-pay__warn + .ck-pay__warn {
    margin-top: 6px;
}

.ck-pay__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 26px;
}

.ck-pay__btn {
    appearance: none;
    border-radius: 4px;
    min-height: 48px;
    font-family: var(--ck-font-heading);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
}

.ck-pay__btn--back {
    background: #fff;
    border: 2px solid #00910D;
    color: #00910D;
}

.ck-pay__btn--go {
    background: #00910D;
    border: 2px solid #00910D;
    color: #fff;
}

.ck-pay__btn--go:hover {
    background: #007a0b;
}

.ck-pay__btn--go:disabled,
.ck-pay__btn--go.is-disabled {
    background: #00910D;
    border-color: #00910D;
    color: #fff;
    cursor: pointer;
    pointer-events: auto;
    opacity: 1;
}

@media (max-width: 767px) {
    .ck-pay .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .ck-pay__booker-grid,
    .ck-pay__booker-grid--3,
    .ck-pay__trip-meta,
    .ck-pay__invoice-row--2,
    .ck-pay__actions {
        grid-template-columns: 1fr !important;
    }

    .ck-pay__ticket-table,
    .ck-pay__ticket-table tbody,
    .ck-pay__ticket-table tr,
    .ck-pay__ticket-table td {
        display: block !important;
        width: 100% !important;
    }

    .ck-pay__ticket-table tr.ck-pay__ticket-table__sep td span {
        margin: 6px 0 !important;
    }

    .ck-pay__ticket-table td {
        padding: 0 0 6px !important;
    }

    .ck-pay__total {
        white-space: normal !important;
    }

    .ck-pay__ticket-head {
        flex-direction: column;
        align-items: flex-start !important;
    }

    .ck-pay__method {
        min-height: 44px;
        gap: 12px;
    }

    .ck-pay__method input {
        width: 20px;
        height: 20px;
    }

    .ck-pay__btn {
        min-height: 48px;
        width: 100%;
    }
}

/* Seat class cards */
.ck-seats-section .ck-card__link {
    display: block;
    color: inherit;
    text-decoration: none;
}
.ck-seats-card__price {
    margin: 0 0 8px !important;
    color: #00910D;
    font-weight: 700;
}
.ck-seats-section .ck-card__body h3 {
    margin-bottom: 6px;
}
.ck-news-detail__lead strong {
    color: #00910D;
}

/* ========== Đặt vé thành công ========== */
.ck-ok {
    --ck-pick-green: #00910D;
    background: #fff;
    padding: 28px 0 64px;
    min-height: 52vh;
    font-family: var(--ck-font-body);
    color: #222;
}

.ck-ok .container {
    max-width: 920px;
}

.ck-ok__steps {
    margin: 0 auto 28px;
    max-width: 820px;
}

.ck-ok__hero {
    text-align: center;
    margin: 8px 0 28px;
}

.ck-ok__check {
    width: 88px;
    height: 88px;
    margin: 0 auto 18px;
    border: 4px solid #00910D;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00910D;
    background: #fff;
}

.ck-ok__check .fa {
    font-size: 42px;
    line-height: 1;
}

.ck-ok__check.is-fail {
    border-color: #e31c23;
    color: #e31c23;
}

.ck-ok__title {
    margin: 0;
    color: #00910D;
    font-family: var(--ck-font-heading);
    font-size: 28px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.25;
}

.ck-ok__check.is-fail + .ck-ok__title {
    color: #e31c23;
}

.ck-ok__card {
    max-width: 560px;
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
    border: 3px solid #00910D;
    border-radius: 16px;
    background: #eaf7ee;
}

.ck-ok__card-title {
    margin: 0;
    padding: 10px 16px;
    text-align: center;
    color: #00910D;
    font-family: var(--ck-font-heading);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: #fff;
    border-bottom: 2px solid #00910D;
}

.ck-ok__card-body {
    padding: 16px 20px 14px;
}

.ck-ok__route {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 6px;
}

.ck-ok__route--back {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed #9ccc9c;
}

.ck-ok__city {
    flex: 0 1 auto;
    min-width: 0;
}

.ck-ok__city--from {
    text-align: left;
}

.ck-ok__city--to {
    text-align: right;
}

.ck-ok__city strong {
    display: block;
    font-family: var(--ck-font-heading);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #111;
    line-height: 1.2;
    white-space: nowrap;
}

.ck-ok__city span {
    display: block;
    margin-top: 6px;
    font-size: 18px;
    font-weight: 800;
    color: #00910D;
}

.ck-ok__route-mid {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex: 1 1 auto;
    min-width: 120px;
    padding-top: 2px;
}

.ck-ok__ship {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 8px;
    color: #111;
}

.ck-ok__ship-ico {
    display: inline-block;
    width: 72px;
    height: 56px;
    flex: 0 0 72px;
    background-color: #000;
    -webkit-mask-image: url("/Content/images/icons/1.png?v=3");
    mask-image: url("/Content/images/icons/1.png?v=3");
    -webkit-mask-mode: luminance;
    mask-mode: luminance;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    filter:
        drop-shadow(0.8px 0 0 #000)
        drop-shadow(-0.8px 0 0 #000)
        drop-shadow(0 0.8px 0 #000)
        drop-shadow(0 -0.8px 0 #000);
}

.ck-ok__arrow {
    position: relative;
    flex: 1 1 auto;
    height: 2px;
    min-width: 28px;
    background: #111;
}

.ck-ok__arrow--l::before,
.ck-ok__arrow--r::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 8px;
    height: 8px;
    border-top: 2px solid #111;
    border-right: 2px solid #111;
}

.ck-ok__arrow--l::before {
    left: 0;
    transform: translateY(-50%) rotate(-135deg);
}

.ck-ok__arrow--r::after {
    right: 0;
    transform: translateY(-50%) rotate(45deg);
}

.ck-ok__date {
    margin: 6px 0 0;
    text-align: center;
    font-size: 15px;
    font-weight: 800;
    color: #00910D;
}

.ck-ok__meta {
    margin: 12px 0 0;
    text-align: center;
}

.ck-ok__meta p {
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 800;
    color: #111;
    line-height: 1.4;
}

.ck-ok__code {
    margin: 10px 0 0;
    padding-top: 8px;
    border-top: 2px dashed #00910D;
    text-align: center;
    color: #00910D;
    font-family: var(--ck-font-heading);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.ck-ok__actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin: 28px auto 0;
    max-width: 560px;
}

.ck-ok__btn {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 168px;
    min-height: 46px;
    padding: 10px 28px;
    border: 0;
    border-radius: 24px;
    background: #e31c23;
    color: #fff !important;
    font-family: var(--ck-font-heading);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none !important;
    cursor: pointer;
}

.ck-ok__btn:hover,
.ck-ok__btn:focus {
    background: #c4161c;
    color: #fff !important;
}

.ck-ok__print {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

@media (max-width: 767px) {
    .ck-ok {
        padding: 16px 0 48px;
    }

    .ck-ok__title {
        font-size: 20px;
        padding: 0 8px;
    }

    .ck-ok__card {
        padding: 0;
    }

    .ck-ok__card-body {
        padding: 12px 12px 10px;
    }

    .ck-ok__city strong {
        font-size: 13px;
        white-space: normal;
    }

    .ck-ok__ship-ico {
        width: 58px;
        height: 46px;
        flex-basis: 58px;
    }

    .ck-ok__code {
        font-size: 16px;
    }

    .ck-ok__actions {
        flex-direction: column;
        align-items: stretch;
        padding: 0 8px;
    }

    .ck-ok__btn {
        width: 100%;
        min-height: 48px;
    }

    .ck-ok .ck-pick__steps,
    .ck-ok__steps {
        overflow-x: auto;
        justify-content: flex-start;
        max-width: 100%;
        padding-bottom: 8px;
    }

    .ck-ok__route {
        gap: 4px;
    }

    .ck-ok__code {
        word-break: break-word;
        max-width: 100%;
    }

    .ck-ok__check {
        width: 72px;
        height: 72px;
    }
}

@media print {
    header,
    footer,
    #back-to-top,
    #preloader,
    .ck-ok__steps,
    .ck-ok__actions {
        display: none !important;
    }

    .ck-ok {
        padding: 0;
    }

    .ck-ok__card {
        border-color: #000;
    }
}

/* Logo loading overlay (page + AJAX .main-loader) */
#preloader,
#preloader.main-loader,
.main-loader {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
}

#preloader #status,
#preloader .ck-loader,
.ck-loader {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 220px !important;
    height: 220px !important;
    margin: 0 !important;
    background: none !important;
    background-image: none !important;
    transform: translate(-50%, -50%) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.ck-loader__ring {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 3px solid rgba(0, 145, 13, 0.16);
    border-top-color: #00910D;
    animation: ck-logo-spin 0.9s linear infinite;
}

.ck-loader__logo {
    position: relative;
    z-index: 1;
    width: 168px;
    max-width: 72%;
    height: auto;
    display: block;
    animation: ck-logo-pulse 1.4s ease-in-out infinite;
}

@keyframes ck-logo-spin {
    to { transform: rotate(360deg); }
}

@keyframes ck-logo-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(0.94); opacity: 0.78; }
}

@media (max-width: 480px) {
    #preloader #status,
    #preloader .ck-loader,
    .ck-loader {
        width: 176px !important;
        height: 176px !important;
    }

    .ck-loader__logo {
        width: 132px;
    }

    .ck-header__logo img {
        height: 44px;
    }

    .ck-header__lang {
        display: none;
    }

    .ck-booking__tab {
        padding: 10px 12px;
        font-size: 12px;
    }

    .ck-pick__step {
        width: 72px;
        flex-basis: 72px;
    }

    .ck-pick__step-ico {
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
    }

    .ck-pick__step-ico img {
        width: 36px;
        height: 36px;
        max-width: 36px;
    }

    .ck-float {
        right: 8px;
        bottom: 12px;
    }

    .ck-ok__title {
        font-size: 18px;
    }
}

.ck-notify {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 100000;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    padding: 16px;
}
.ck-notify__box {
    width: 100%;
    max-width: 420px;
    background: #fff;
    border-radius: 10px;
    padding: 22px 24px 18px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22);
    text-align: center;
}
.ck-notify__title {
    margin: 0 0 10px;
    color: #00910D;
    font-family: var(--ck-font-heading);
    font-size: 18px;
    font-weight: 800;
}
.ck-notify__msg {
    margin: 0 0 16px;
    color: #333;
    font-size: 15px;
    line-height: 1.5;
}
.ck-notify__ok {
    appearance: none;
    min-width: 96px;
    min-height: 40px;
    border: 0;
    border-radius: 8px;
    background: #e31c23;
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}
