﻿.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 */ }
