.card-tour-container { display: flex; gap: 16px; flex-wrap: wrap; justify-content: space-between; height: 100% }

.card-tour { background: white; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); overflow: hidden; width: 100%; }

    .card-tour img { width: 100%; height: 180px; object-fit: cover; }

.card-tour-content { padding: 0 9px 0 9px; }

.timer { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }

    .timer span:first-child { background: #e0f0ff; color: #007bff; padding: 2px 8px; border-radius: 5px; font-size: 14px; }

    .timer span:last-child { color: red; font-weight: bold; font-size: 14px; }

.tour-wrap { display: flex; /* justify-content: center; */ /* align-items: baseline; */ height: 50px; justify-content: center; flex-direction: column; }

.tour-title { font-size: 15px; font-weight: bold; color: black; text-transform: capitalize; margin-bottom: 0 !important; margin-top: 0 !important; width: 100%; white-space: normal; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; word-break: break-word; }

.tour-info i { flex: 0 0 18px; text-align: center; line-height: 20px; }

.tour-info strong { color: #333; }

.price { display: flex; /* flex: 1; */ justify-content: center; align-items: center; }

.old-price { text-decoration: line-through; color: #999; font-size: 14px; }

.new-price { color: rgb(255 129 0); font-weight: bold; font-size: 17px; }

.action { margin-top: 10px; display: flex; justify-content: space-between; align-items: center; }
.img-tour { border-bottom: 1px solid #dddada; border-radius: 2px !important; }
.book-btn { background-color: #ff860c; color: white; border: 1px solid #ff860c; padding: 8px 16px; border-radius: 6px; font-weight: bold; cursor: pointer; transition: all 0.3s ease; box-sizing: border-box; }

.view-all { text-align: center; margin-top: 20px; }

    .view-all button { background: white; color: #007bff; border: 1px solid #007bff; padding: 8px 20px; border-radius: 5px; font-weight: bold; cursor: pointer; }

.book-btn:hover { cursor: pointer; background: #ffffff; color: #ff860c; border: #ff860c solid 1px; }
.col-image { flex: 1; position: relative; }

.image-thumbnail-cs { height: 100%; position: relative; width: 100%; object-fit: fill; }
.text-title { font-size: 20px; font-weight: 700; text-transform: uppercase; text-align: center; color: black; }
.schedule-item { background: #f8f8f8; }
.schedule-content { margin: 0; padding: 10px; list-style: none; border-top: 1px dotted #cfc7c7; padding: 10px 30px 10px 30px }

.schedule-title { overflow: hidden; margin-bottom: 2px; border-radius: 5px; padding: 10px; display: flex; justify-content: space-between; align-items: center; /* This centers vertically */ cursor: pointer }
.schedule-item-title { font-weight: 700 }

.colaspe-button { float: right; font-size: 16px; cursor: pointer; margin-right: 5px; display: flex; align-items: center; /* Vertically center the icon */ justify-content: center; height: 100%; }


.schedule-content > .line { position: absolute; border-left: .5px dashed #0b5da7; height: calc(100% - 2rem); top: 1rem; z-index: 1; }

.schedule-noidung-detail { border-left: .5px dashed #0b5da7; padding: 5px 5px 5px 30px; }

    .schedule-noidung-detail > .detail { display: -webkit-box; -webkit-line-clamp: 4; /* Change this number for more or fewer lines */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }

.schedule-item-image { height: auto; }
    .schedule-item-image > div { padding: 4px; }
        .schedule-item-image > div > a > img { object-fit: cover; height: 100%; width: 100% }
.blinking-tag { display: inline-block; margin-left: 6px; padding: 0 7px; background-color: rgb(255, 0, 0); color: rgb(255, 255, 255); font-size: 12px; animation: blink 1s infinite; }

@keyframes blink {
    0%, 100% { opacity: 1; }

    50% { opacity: 0.3; }
}

.card-tour-container { cursor: pointer; transition: all 0.5s; position: relative; }
.card-tour-container { transition: box-shadow 0.3s ease, transform 0.3s ease; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 4px !important; }

    .card-tour-container:hover { box-shadow: 0 0.0625rem 20px 0 rgb(0 0 0 / 30%); transform: translateY(-4px); cursor: pointer; border-radius: 4px !important; }
.limited-lines { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; line-height: 1.5em; max-height: 7.5em; /* 5 lines x 1.5em */ }

/* ===== Trang chi tiết lịch trình (.ct-lt) ===== */
.ct-lt__title { font-size: 1.5rem; font-weight: 700; line-height: 1.35; color: #0b3d6e; margin: 0 0 .75rem; }
    .ct-lt__title i { color: #0b5da7; margin-right: 6px; }

.ct-lt__price { display: flex; align-items: baseline; gap: 10px; padding: 10px 14px; background: #fff7ec; border-left: 4px solid #ff860c; border-radius: 6px; margin-bottom: 1rem; }
.ct-lt__price-label { color: #6c757d; font-size: .9rem; }
.ct-lt__price-value { color: #e8590c; font-size: 1.35rem; font-weight: 700; }

.ct-lt__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0 0 1rem; padding: 0; }
.ct-lt__stat { display: flex; flex-direction: column; align-items: center; padding: 10px 6px; background: #f1f7fd; border-radius: 8px; text-align: center; }
    .ct-lt__stat i { color: #0b5da7; font-size: 1.1rem; margin-bottom: 4px; }
.ct-lt__stat-value { font-size: 1.25rem; font-weight: 700; color: #212529; line-height: 1.2; }
.ct-lt__stat-label { font-size: .8rem; color: #6c757d; }

.ct-lt__desc { text-align: justify; line-height: 1.65; color: #343a40; }

.ct-lt__map-wrap { position: sticky; top: 80px; }
.ct-lt__map { height: 420px; min-height: 300px; border-radius: 10px; overflow: hidden; border: 1px solid #dee2e6; }

.ct-lt__schedule { padding-bottom: 1rem; }
.ct-lt__section-title { font-size: 1.2rem; font-weight: 700; color: #0b3d6e; margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid #e9ecef; }
    .ct-lt__section-title i { margin-right: 6px; color: #0b5da7; }

/* Timeline: đường dọc nối các bước, số thứ tự khớp với đánh số marker trên bản đồ */
.ct-lt__timeline { position: relative; padding-left: 20px; --bs-accordion-border-width: 0; }
    .ct-lt__timeline::before { content: ""; position: absolute; left: 15px; top: 10px; bottom: 10px; border-left: 2px dashed #9cc3e6; }

/* Tiêu đề ngày của tour nhiều ngày, nằm trên đường timeline */
.ct-lt__day { position: relative; display: inline-block; margin: 6px 0 12px 22px; padding: 4px 14px; border-radius: 16px; background: #0b5da7; color: #fff; font-weight: 700; font-size: .9rem; }
    .ct-lt__day i { margin-right: 6px; }

.ct-lt__step { position: relative; margin-bottom: 12px; border: 1px solid #dee2e6 !important; border-radius: 10px !important; overflow: hidden; background: #fff; margin-left: 22px; transition: box-shadow .2s ease; }
    .ct-lt__step:hover { box-shadow: 0 2px 10px rgba(0,0,0,.1); }
.ct-lt__step-no { position: absolute; left: -44px; top: 14px; width: 28px; height: 28px; border-radius: 50%; background: #0b5da7; color: #fff; font-weight: 700; font-size: .85rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 4px #fff; z-index: 2; }

.ct-lt__step .accordion-button { background: #fff; color: #212529; padding: .85rem 1rem; box-shadow: none; }
    .ct-lt__step .accordion-button:not(.collapsed) { background: #f1f7fd; color: #0b3d6e; }
.ct-lt__step .accordion-body { background: #fafbfc; }

.ct-lt__step-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 6px; }
.ct-lt__time { background: #e0f0ff; color: #0b5da7; padding: 2px 8px; border-radius: 5px; font-size: .85rem; font-weight: 600; white-space: nowrap; }
.ct-lt__step-name { font-weight: 700; font-size: 1.02rem; }
.ct-lt__free { background: #dc3545; color: #fff; font-size: .75rem; padding: 1px 8px; border-radius: 10px; }

.ct-lt__step-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.ct-lt__chip { display: inline-flex; align-items: center; gap: 5px; font-size: .82rem; color: #495057; background: #f1f3f5; padding: 2px 9px; border-radius: 12px; }
    .ct-lt__chip i { color: #0b5da7; }

.ct-lt__address { font-weight: 500; margin-bottom: .75rem; }
    .ct-lt__address i { color: #dc3545; margin-right: 4px; }

.ct-lt__thumb { aspect-ratio: 4 / 3; border-radius: 6px; }
    .ct-lt__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
    .ct-lt__thumb:hover img { transform: scale(1.08); }

@media (max-width: 991.98px) {
    .ct-lt__map-wrap { position: static; }
    .ct-lt__map { height: 320px; }
}

@media (max-width: 575.98px) {
    .ct-lt__title { font-size: 1.25rem; }
    .ct-lt__timeline { padding-left: 14px; }
        .ct-lt__timeline::before { left: 9px; }
    .ct-lt__step { margin-left: 18px; }
    .ct-lt__step-no { left: -38px; width: 24px; height: 24px; font-size: .75rem; }
}