/* ═══ 8. KIỂU TRAVELGUIDESTIP, MÀU TRIPLARKS (chủ site chọn 05/11/2026 tối) ═══════════
 * "Áp dụng nguyên giao diện travelguidestip.com, thay đổi màu sắc, giữ nguyên số từ."
 * Số đo lấy từ CSS thật của theme tgt-18 (1-tokens … 5-responsive): cỡ chữ, khoảng cách, bo góc,
 * hộp "In short", dải chip, cột phải 300px, thẻ viền 14px. Chữ RIÊNG: Plus Jakarta Sans + Source Sans 3
 * (TGT dùng Bricolage + Karla; đổi theo yêu cầu chủ site 05/11 để hai site không trùng font).
 * MÀU RIÊNG (không lấy của TGT để hai site không trùng hệt):
 *   mực tím than #1E1B2E · điểm nhấn đỏ mận #9C1D52 (TGT: xanh sông) · tour xanh ngọc #0E7469
 *   (TGT: xanh lá) · nút chính san hô #F26B4F chữ mực (TGT: vàng) · nền nhạt hồng-xám.
 * File nạp CUỐI, chỉ ĐÈ; nội dung bài không đổi. Bỏ khỏi functions.php là về giao diện cũ.
 */
:root {
  --paper: #FFFFFF;
  --surface: #FFFFFF;
  --ink: #1E1B2E;
  --muted: #5E5A6B;
  --body-2: #3A3647;
  --rule: #E8E1E5;
  --rule-2: #F7F2F4;
  --rule-3: #D9D0D6;
  --brand: #9C1D52;
  --action: #9C1D52;
  --action-dam: #7C1641;
  --tint: #F8EEF2;
  --cta: #F26B4F;
  --cta-dam: #D4523A;
  --tour: #0E7469;
  --tour-chu: #0B6158;
  --tour-nhat: #E2F2EF;
  --be: #F7F3EF;
  --bong: none;
  --chu-de: "Source Sans 3", system-ui, "Segoe UI", sans-serif;
  --chu-tieu: "Plus Jakarta Sans", system-ui, "Segoe UI", sans-serif;
  --chu-than: "Source Sans 3", system-ui, "Segoe UI", sans-serif;
  --chu-nhan: "Source Sans 3", system-ui, "Segoe UI", sans-serif;
  --khung: 1260px;
}
html { font-synthesis: none; }
body { background: var(--paper); font: 16.5px/1.6 var(--chu-than); color: var(--body-2); }
h1, h2, h3, h4 { font-family: var(--chu-tieu); font-weight: 800; letter-spacing: -0.01em; color: var(--ink); }
a { color: var(--action); }
.tlk-thoi { display: none; }
.tlk-nhan, .tlk-loai { font-family: var(--chu-than); font-weight: 700; letter-spacing: 0.08em; }

/* Nút (TGT .nut-vang / .nut-vien) */
.tlk-nut { background: var(--cta); border-color: var(--cta); color: var(--ink) !important; border-radius: 10px; min-height: 44px; padding: 0 18px; font: 700 15px var(--chu-than); box-shadow: 0 2px 0 var(--cta-dam); }
.tlk-nut:hover { background: #FF8466; border-color: #FF8466; color: var(--ink); }
.tlk-nut--vien { background: var(--surface); color: var(--action) !important; border: 1.5px solid var(--action); box-shadow: none; min-height: 40px; padding: 0 13px; font-size: 14px; }
.tlk-nut--vien:hover { background: var(--tint); }
.tlk-nut-vuong { border-radius: 10px; border-color: var(--rule-3); }
.tlk-lk-mui { color: var(--action); font-family: var(--chu-than); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.tlk-chip { border-radius: 999px; border-color: var(--rule-3); font: 600 14px var(--chu-than); }
.tlk-chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); }

/* ── Đầu trang (TGT .dau: cao 66, logo Bricolage 800 21px, menu 600 15px, gạch dưới khi chọn) ── */
.tlk-dau { background: var(--surface); border-bottom: 1px solid var(--rule); }
.tlk-dau__trong { min-height: 66px; }
.tlk-logo { gap: 9px; }
.tlk-logo__thoi { width: 28px; height: 28px; transform: none; border-radius: 8px; background: var(--action); position: relative; }
.tlk-logo__thoi::after { content: ""; position: absolute; left: 6px; right: 6px; bottom: 7px; height: 5px; border-radius: 3px; background: var(--cta); }
.tlk-logo__chu { font: 800 21px var(--chu-tieu); letter-spacing: -0.02em; text-transform: lowercase; color: var(--ink); }
.tlk-menu a { font: 600 15px var(--chu-than); color: var(--ink); border-bottom: 2px solid transparent; }
.tlk-menu a:hover, .tlk-menu a[aria-current] { border-color: var(--cta); color: var(--ink); }

/* ── Khung bài: cột chữ + cột phải 300px (TGT .ct) ── */
.tlk-bai:not(.tlk-bai--gon) { display: grid; grid-template-columns: minmax(0, 1fr) 300px; column-gap: 44px; padding-bottom: 40px; }
.tlk-bai:not(.tlk-bai--gon) > .tlk-ray { width: 300px; }
.tlk-bai__chinh { min-width: 0; }

/* Đầu bài trong cột (TGT .bc / h1 / .by / .disc / .hero) */
.tlk-dau-bai { padding-top: 20px; }
.tlk-dau-bai .tlk-bc { font-size: 13.5px; color: var(--muted); margin: 0 0 6px; gap: 4px 6px; }
.tlk-dau-bai .tlk-bc a { color: var(--muted); text-decoration: underline; text-underline-offset: 2px; }
.tlk-dau-bai .tlk-loai { display: none; }
.tlk-dau-bai h1 { font: 800 42px/1.08 var(--chu-tieu); letter-spacing: -0.025em; margin: 6px 0 12px; max-width: none; }
.tlk-dau-bai .tlk-tg { font: 400 14px var(--chu-than); color: var(--muted); margin: 0 0 6px; display: flex; flex-wrap: wrap; gap: 4px 10px; }
.tlk-dau-bai .tlk-tg a { color: var(--ink); font-weight: 700; text-decoration: none; }
.tlk-dau-bai__cb { font-size: 13px; color: var(--muted); margin: 0 0 14px; }
.tlk-dau-bai__hero { margin: 6px 0 16px; border-radius: 14px; overflow: hidden; background: var(--rule); aspect-ratio: 16 / 8; }
.tlk-dau-bai__hero img { width: 100%; height: 100%; object-fit: cover; }

/* "In short" (TGT .tra-loi) */
.tlk-the-noi { margin: 4px 0 18px; max-width: none; background: var(--tint); border: 0; border-radius: 16px; box-shadow: none; padding: 18px 20px; gap: 8px; }
.tlk-the-noi__nhan { font: 800 12px var(--chu-tieu); letter-spacing: 0.12em; text-transform: uppercase; color: var(--action); }
.tlk-the-noi__nhan span { font: 500 12px var(--chu-than); letter-spacing: 0; text-transform: none; color: var(--muted); }
.tlk-the-noi__qa { font: 400 16.5px/1.6 var(--chu-than); color: var(--ink); }
.tlk-the-noi__hang small { font-family: var(--chu-than); font-size: 12px; }
.tlk-ngu { background: var(--tint); border-left: 0; border-radius: 14px; max-width: none; }
.tlk-ngu > .tlk-nhan { color: var(--action); font-family: var(--chu-tieu); font-weight: 800; }

/* Dải chip mục (TGT .jt) */
.tlk-ml-gap { display: block !important; background: none; border: 0 !important; padding: 0; margin: 0 0 18px; }
.tlk-ml-gap:not([open]) { display: none !important; }
.tlk-ml-gap > summary { display: none; }
.tlk-ml-gap .tlk-ml { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; list-style: none; margin: 0; padding: 2px; counter-reset: none; }
.tlk-ml-gap .tlk-ml::-webkit-scrollbar { display: none; }
.tlk-ml-gap .tlk-ml li { flex: none; }
.tlk-ml-gap .tlk-ml li::before, .tlk-ml-gap .tlk-ml a::before { display: none; content: none; }
.tlk-ml-gap .tlk-ml a { display: block; border: 1px solid var(--rule-3); border-radius: 999px; padding: 7px 13px; font: 600 14px var(--chu-than); color: var(--ink); text-decoration: none; white-space: nowrap; max-width: 240px; overflow: hidden; text-overflow: ellipsis; background: var(--surface); }
.tlk-ml-gap .tlk-ml a:hover { border-color: var(--action); color: var(--action); }

/* ── Thân bài (TGT .van: 17px/1.7; h2 30px/1.15 800; ảnh bo 14) ── */
.tlk-van { font: 400 17px/1.7 var(--chu-than); color: var(--body-2); }
.tlk-van > * { max-width: none; }
.tlk-van h2 { font: 800 30px/1.15 var(--chu-tieu); margin: 34px 0 10px; padding-left: 0; scroll-margin-top: 70px; }
.tlk-van h2::before { display: none; }
.tlk-van h3 { font: 800 20px/1.25 var(--chu-tieu); margin: 22px 0 6px; }
.tlk-van p { margin: 0 0 1em; }
.tlk-van a:not(.tl-btn):not(.tlk-nut) { color: var(--action); text-decoration: underline; text-underline-offset: 2px; }
.tlk-van a[href*="getyourguide"]:not(.tl-btn) { color: var(--tour-chu); }
.tlk-van strong, .tlk-van b { font-weight: 700; color: var(--ink); }
.tlk-van figure, .tlk-van .wp-block-image { margin: 18px 0; }
.tlk-van img { border-radius: 14px; }
.tlk-van figcaption { font: 400 13px var(--chu-than); color: var(--muted); margin-top: 6px; }
.tlk-van ul, .tlk-van ol { padding-left: 22px; }
.tlk-van li { margin-bottom: 6px; }
.tlk-van .tl-disclosure { font-size: 13px; color: var(--muted); }
.tlk-van .tl-quick { background: var(--be) !important; border: 0 !important; border-left: 4px solid var(--action) !important; border-radius: 0 12px 12px 0 !important; padding: 14px 18px !important; }
.tlk-van .tl-quick::before { font: 800 12px var(--chu-tieu); letter-spacing: .1em; color: var(--action); }
.tlk-van a.tl-btn { background: var(--surface) !important; color: var(--action) !important; -webkit-text-fill-color: var(--action); border: 1.5px solid var(--action) !important; border-radius: 10px !important; min-height: 40px; padding: 0 14px !important; font: 700 14px var(--chu-than) !important; }
.tlk-van a.tl-btn:hover { background: var(--tint) !important; }
.tlk-van .tl-map-stay22 iframe { border-radius: 14px; border-color: var(--rule); }
.tlk-van .tl-map-stay22 p { font-family: var(--chu-than); }
.tlk-van .tl-booking-links, .tlk-van .tl-answer { border-radius: 14px; border: 1px solid var(--rule); background: var(--surface); }
.tlk-van .tl-answer { border-left: 4px solid var(--action); }
.tlk-van .tl-eyebrow { font: 800 12px var(--chu-tieu); color: var(--action); }
.tlk-van .tl-source, .tlk-van .tl-checked { border-left-color: var(--rule-3); }
/* Bảng (TGT .bang-cuon / .bang) */
.tlk-van table { width: 100%; border-collapse: collapse; font-size: 14.5px; line-height: 1.4; }
.tlk-van .tl-tablewrap, .tlk-van .tlk-bang, .tlk-van .wp-block-table { border: 1px solid var(--rule); border-radius: 12px; overflow-x: auto; }
.tlk-van th, .tlk-van td { padding: 10px 12px; text-align: left; border-top: 1px solid var(--rule); vertical-align: top; }
.tlk-van thead th { border-top: 0; background: var(--rule-2); font: 700 13px var(--chu-than); color: var(--ink); }
.tlk-van td:first-child { font-weight: 700; color: var(--ink); }
/* FAQ (TGT .faq) */
.tlk-van details { border-top: 1px solid var(--rule); padding: 12px 0; }
.tlk-van details summary { cursor: pointer; font: 700 17px var(--chu-tieu); color: var(--ink); }

/* ── Cột phải (TGT .ray / .hop / .cum) ── */
.tlk-ray { padding-top: 20px; }
.tlk-ray { position: sticky; top: 16px; align-self: start; display: flex; flex-direction: column; gap: 16px; }
.tlk-ray__ml { display: none; }
.tlk-toi, .tlk-them { border: 1px solid var(--rule) !important; border-radius: 14px !important; padding: 16px !important; background: var(--surface) !important; box-shadow: none !important; color: var(--body-2) !important; }
.tlk-toi .tlk-nhan, .tlk-them .tlk-nhan { font: 800 16px var(--chu-tieu); letter-spacing: 0; text-transform: none; color: var(--ink); margin: 0 0 10px; border: 0; padding: 0; }
.tlk-toi p { font-size: 12.5px; color: var(--muted) !important; margin: 8px 0 0; line-height: 1.45; }
.tlk-nut-toi { background: var(--surface) !important; color: var(--action) !important; border: 1.5px solid var(--action) !important; border-radius: 10px !important; min-height: 40px; font: 700 14px var(--chu-than); margin-bottom: 8px; padding: 0 13px; }
.tlk-nut-toi:hover { background: var(--tint) !important; }
.tlk-them a { display: block; padding: 8px 0; border-top: 1px solid var(--rule); font: 600 15px var(--chu-than); color: var(--ink); text-decoration: none; }
.tlk-them a:first-of-type { border-top: 0; padding-top: 0; }
.tlk-them a:hover { color: var(--action); }
.tlk-them small { display: block; font-weight: 400; color: var(--muted); font-size: 12.5px; }

/* Hộp tác giả, "Keep planning" */
.tlk-bbt { border: 1px solid var(--rule); border-radius: 14px; background: var(--surface); }
.tlk-bbt__ten a { font-family: var(--chu-tieu); font-weight: 800; color: var(--ink); }
.tlk-tiep { border: 1px solid var(--rule); border-radius: 14px; padding: 16px 20px; }
.tlk-tiep h2 { font: 800 20px var(--chu-tieu); }

/* Thẻ trang chủ / chuyên mục: viền 1px, bo 14–16 (TGT .nuoc / .hoi / .tp) */
.tlk-tb, .tlk-dd, .tlk-the--chu, .tlk-the--ds, .tlk-kham__o, .tlk-y, .tlk-the { border-radius: 16px !important; box-shadow: none !important; }
.tlk-tb__de, .tlk-dd__ten, .tlk-the__de, .tlk-muc__de { font-family: var(--chu-tieu) !important; font-weight: 800 !important; }
.tlk-bia-tc h1 { font-family: var(--chu-tieu); font-weight: 800; }
.tlk-bia-tc::after { display: none; }

/* Chân trang (TGT .chan: nền be, viền trên) */
.tlk-chan { background: var(--be); border-top: 1px solid var(--rule); color: var(--body-2); }
.tlk-chan a { color: var(--body-2); }
.tlk-chan h2, .tlk-chan h3, .tlk-chan h4, .tlk-chan b { color: var(--ink); font-family: var(--chu-tieu); }

/* Thanh đáy */
.tlk-thanh { border-radius: 0; }
.tlk-thanh .tlk-nut { border-radius: 10px; }

/* ══ Khối KS có tên (tl_shortlist) + vé (tl_tours): thẻ viền như TGT .khu ══ */
.tlk-sl, .tlk-ve { border: 1px solid var(--rule); border-radius: 14px; background: var(--surface); margin: 0 0 18px; box-shadow: none; }
.tlk-sl__dau { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 14px; padding: 16px 18px 0; }
.tlk-sl__dau h2 { font: 800 22px var(--chu-tieu); margin: 0; }
.tlk-sl__dau small { font: 500 13px var(--chu-than); color: var(--muted); }
.tlk-sl__chon { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 12px 18px 0; }
.tlk-sl__chon::-webkit-scrollbar { display: none; }
.tlk-sl__chon:not(.tlk-sl__chon--anh) button { flex: none; border: 1px solid var(--rule-3); background: var(--surface); border-radius: 999px; padding: 7px 13px; font: 600 14px var(--chu-than); color: var(--ink); cursor: pointer; }
.tlk-sl__chon:not(.tlk-sl__chon--anh) button[aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.tlk-sl__chon--anh { display: grid; grid-auto-flow: column; grid-auto-columns: 150px; gap: 10px; padding: 12px 18px 2px; scroll-snap-type: x mandatory; }
.tlk-sl__chon--anh button { position: relative; aspect-ratio: 3 / 4; padding: 0; border: 0; border-radius: 12px; color: #fff; text-align: left; overflow: hidden; background: #333 var(--anh) center / cover; scroll-snap-align: start; cursor: pointer; }
.tlk-sl__chon--anh button::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.82)); }
.tlk-sl__chon--anh button > span { position: absolute; z-index: 1; left: 10px; right: 10px; bottom: 10px; display: flex; flex-direction: column; gap: 3px; }
.tlk-sl__chon--anh small { font: 700 10.5px var(--chu-than); letter-spacing: .08em; text-transform: uppercase; opacity: .92; }
.tlk-sl__chon--anh b { font: 800 17px/1.15 var(--chu-tieu); }
.tlk-sl__chon--anh button[aria-selected="true"] { outline: 3px solid var(--cta); outline-offset: -3px; }
.tlk-sl__mh { font: 500 10px var(--chu-than); font-style: normal; opacity: .8; }
.tlk-sl__nd { padding: 12px 18px 16px; }
.tlk-sl__nd[hidden] { display: none; }
.tlk-sl__khu { font: 800 20px var(--chu-tieu); color: var(--ink); margin: 0 0 2px; }
.tlk-sl__vi { font-size: 15px; margin: 0 0 6px; }
.tlk-sl__ds { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.tlk-sl__ds li { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; padding: 9px 10px; border-radius: 10px; background: var(--tint); }
.tlk-sl__hg { font: 800 11px var(--chu-tieu); letter-spacing: .06em; color: #fff; text-align: center; padding: 4px 0; background: var(--action); border-radius: 5px; }
.tlk-sl__ten { font: 700 16px/1.3 var(--chu-than); color: var(--action) !important; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.tlk-sl__ghi { display: block; font: 400 13.5px/1.4 var(--chu-than); color: var(--muted); margin-top: 2px; }
.tlk-sl__lk, .tlk-ve__lk { font: 700 14px var(--chu-than); color: var(--action) !important; white-space: nowrap; text-decoration: none; }
.tlk-ve__lk { color: var(--tour-chu) !important; }
.tlk-sl__hang { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; }
.tlk-sl__cb { font: 400 12.5px/1.5 var(--chu-than); color: var(--muted); margin: 0; padding: 0 18px 14px; }
.tlk-ve { padding: 14px 18px 8px; }
.tlk-ve h2 { font: 800 20px var(--chu-tieu); margin: 0 0 6px; }
.tlk-ve__nhan { font: 700 12px var(--chu-than); letter-spacing: .08em; text-transform: uppercase; color: var(--tour-chu); margin: 0; }
.tlk-ve ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.tlk-ve li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; padding: 9px 10px; border-radius: 10px; background: var(--tour-nhat); }
.tlk-ve li b { font: 700 15.5px/1.3 var(--chu-than); color: var(--ink); }
.tlk-ve li small { display: block; font: 400 13.5px/1.4 var(--chu-than); color: var(--muted); }
.tlk-ve li em { font-style: normal; font: 800 11px var(--chu-tieu); letter-spacing: .08em; text-transform: uppercase; color: #fff; background: var(--tour); padding: 2px 6px; border-radius: 4px; margin-right: 6px; }

/* ═══ Co giãn (TGT 5-responsive: 1060 / 860 / 720) ═══ */
@media (max-width: 1080px) {
  .tlk-bai:not(.tlk-bai--gon) { grid-template-columns: minmax(0, 1fr); }
  .tlk-ray { display: none; } /* 6-dien-thoai an cot phai; dong .tlk-ray{display:flex} o tren nap sau nen phai an lai (05/11: villa/food bi ep cot chu con 22px) */
}
@media (max-width: 760px) {
  .tlk-dau__trong { min-height: 58px; }
  .tlk-logo__chu { font-size: 19px; }
  .tlk-dau-bai h1 { font-size: 30px; line-height: 1.1; }
  .tlk-dau-bai__hero { aspect-ratio: 16 / 10; margin-left: calc(var(--le) * -1); margin-right: calc(var(--le) * -1); border-radius: 0; }
  .tlk-the-noi { padding: 16px; }
  .tlk-van { font-size: 16px; }
  .tlk-van h2 { font-size: 24px; margin-top: 28px; }
  .tlk-sl__chon--anh { grid-auto-columns: 128px; }
  .tlk-sl__ds li { grid-template-columns: 42px minmax(0, 1fr); }
  .tlk-sl__ds li > .tlk-sl__lk { grid-column: 2; justify-self: start; }
  .tlk-ve li { grid-template-columns: minmax(0, 1fr); }
  .tlk-ve li .tlk-ve__lk { justify-self: start; margin-top: 4px; }
}

/* ══ Trang best-hotels kiểu TGT (inc/khoi-khach-san.php, meta tl_hotels) ══ */
.tlk-pick { background: var(--be); border: 1px solid var(--rule); border-radius: 14px; padding: 14px 18px 16px; margin: 0 0 22px; }
.tlk-pick h2 { font: 800 19px var(--chu-tieu); margin: 0 0 8px; }
.tlk-pick dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 22px; }
.tlk-pick dt { font: 700 11.5px var(--chu-than); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.tlk-pick dd { margin: 2px 0 0; }
.tlk-ks-ten { color: var(--action) !important; font-weight: 700; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.tlk-ks h2 { font: 800 30px/1.15 var(--chu-tieu); margin: 0 0 10px; }
.tlk-ks-loc { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.tlk-ks-loc button { border: 1.5px solid var(--rule-3); background: var(--surface); border-radius: 999px; padding: 0 15px; min-height: 38px; font: 700 14px var(--chu-than); color: var(--ink); cursor: pointer; }
.tlk-ks-loc button[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.tlk-ks-ds { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.tlk-ks-ds li { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 16px; border: 1px solid var(--rule); border-radius: 14px; background: var(--surface); }
.tlk-ks-ds li[hidden] { display: none; }
.tlk-ks-so { width: 38px; height: 38px; border-radius: 11px; background: var(--ink); color: #fff; display: grid; place-items: center; font: 800 16px var(--chu-tieu); }
.tlk-ks-ds h3 { font: 800 19px/1.25 var(--chu-tieu); margin: 0; }
.tlk-ks-khu { font: 600 13.5px var(--chu-than); color: var(--muted); margin: 2px 0 8px !important; }
.tlk-ks-ds dl { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 14px; font-size: 14.5px; line-height: 1.45; }
.tlk-ks-ds dt { color: var(--muted); }
.tlk-ks-ds dd { margin: 0; color: var(--ink); }
.tlk-ks-bang { overflow-x: auto; margin: 0 0 8px; border: 1px solid var(--rule); border-radius: 12px; }
.tlk-ks-bang table { width: 100%; border-collapse: collapse; font-size: 14.5px; line-height: 1.4; }
.tlk-ks-bang th, .tlk-ks-bang td { padding: 10px 12px; text-align: left; border-top: 1px solid var(--rule); vertical-align: middle; }
.tlk-ks-bang thead th { border-top: 0; background: var(--be); font: 700 13px var(--chu-than); color: var(--ink); }
.tlk-ks-bang td:first-child { font-weight: 700; color: var(--ink); }
.tlk-ks-bang .tlk-nut { min-height: 34px; padding: 0 10px; font-size: 13px; white-space: nowrap; }
.tlk-ks-cb { font-size: 13px; color: var(--muted); margin: 0 0 20px; }
.tlk-picks__dong { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 0; border-top: 1px solid var(--rule); }
.tlk-picks__dong:first-of-type { border-top: 0; padding-top: 0; }
.tlk-picks .tlk-ks-ten { font-size: 15px; display: inline; padding: 0; border: 0; }
.tlk-picks small { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.tlk-picks a.tlk-nut { display: inline-flex; min-height: 36px; padding: 0 10px; font-size: 13px; border: 1.5px solid var(--action); border-radius: 10px; }
@media (max-width: 760px) {
  .tlk-ks h2 { font-size: 24px; }
  .tlk-ks-ds li { grid-template-columns: 34px minmax(0, 1fr); padding: 14px; }
  .tlk-ks-ds li > .tlk-nut { grid-column: 2; justify-self: start; }
  .tlk-ks-so { width: 32px; height: 32px; font-size: 14px; border-radius: 9px; }
  .tlk-ks-ds dl { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .tlk-ks-ds dt { margin-top: 4px; font-size: 13px; }
}

/* ══ Mẫu TGT where-to-stay / itinerary (inc/khoi-khu-tgt.php) ══ */
/* Our top choice (TGT .tc): viền 2px điểm nhấn, nhãn viên thuốc đè mép trên */
.tlk-tc { border: 2px solid var(--action); border-radius: 16px; padding: 20px 22px; display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 20px; background: var(--surface); margin: 30px 0 22px; position: relative; }
.tlk-tc:not(:has(.tlk-tc__anh)) { grid-template-columns: minmax(0, 1fr); }
.tlk-tc__nhan { position: absolute; top: -13px; left: 18px; margin: 0; background: var(--action); color: #fff; font: 800 12px var(--chu-tieu); letter-spacing: .12em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.tlk-tc__anh { border-radius: 12px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--rule); }
.tlk-tc__anh img { width: 100%; height: 100%; object-fit: cover; }
.tlk-tc h2 { font: 800 25px/1.15 var(--chu-tieu); margin: 4px 0 8px; }
.tlk-tc p { font-size: 16px; margin: 0 0 8px; }
.tlk-tc__hang { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin-top: 12px; }
.tlk-tc__phu { font-size: 14.5px; color: var(--muted); }
/* Lưới khu (TGT .khu-luoi / .khu / .cap) */
.tlk-khu h2 { font: 800 30px/1.15 var(--chu-tieu); margin: 10px 0 12px; }
.tlk-khu-luoi { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; margin: 0 0 10px; }
.tlk-khu-the { border: 1px solid var(--rule); border-radius: 14px; padding: 14px 15px 15px; display: flex; flex-direction: column; background: var(--surface); }
.tlk-khu-the__nhom { font: 700 12px var(--chu-than); letter-spacing: .08em; text-transform: uppercase; color: var(--action); margin: 0 0 2px !important; }
.tlk-khu-the h3 { font: 800 21px var(--chu-tieu); margin: 0 0 4px; }
.tlk-khu-the__mo { font-size: 14.5px; line-height: 1.5; margin: 0 0 12px !important; }
.tlk-cap { margin: auto 0 0; display: flex; flex-direction: column; gap: 8px; }
.tlk-cap > div { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 8px; align-items: start; padding: 9px 10px; border-radius: 10px; background: var(--tint); }
.tlk-cap dt { font: 800 11px var(--chu-tieu); letter-spacing: .06em; text-transform: uppercase; color: #fff; background: var(--action); border-radius: 5px; text-align: center; padding: 3px 0; margin-top: 2px; }
.tlk-cap .tlk-cap__stay { background: var(--tour-nhat); }
.tlk-cap .tlk-cap__stay dt { background: var(--tour); }
.tlk-cap dd { margin: 0; font-size: 14.5px; line-height: 1.4; min-width: 0; }
.tlk-cap dd small { display: block; color: var(--muted); font-size: 13px; }
/* Dải lộ trình ngày (TGT .lo-trinh) */
.tlk-lo-trinh { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 0 0 18px; }
.tlk-lo-trinh a { display: flex; flex-direction: column; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--rule); font-size: 14px; line-height: 1.3; color: var(--ink); text-decoration: none; }
.tlk-lo-trinh a:hover { border-color: var(--action); }
.tlk-lo-trinh b { font: 800 12.5px var(--chu-tieu); color: var(--action); letter-spacing: .06em; text-transform: uppercase; }
@media (max-width: 760px) {
  .tlk-tc { grid-template-columns: minmax(0, 1fr); padding: 20px 16px 16px; gap: 12px; }
  .tlk-tc__anh { aspect-ratio: 16 / 8; }
  .tlk-tc h2 { font-size: 22px; }
  .tlk-khu h2 { font-size: 24px; }
  .tlk-khu-luoi { grid-template-columns: minmax(0, 1fr); }
  .tlk-lo-trinh { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 150px; overflow-x: auto; scrollbar-width: none; }
}