/* TripChina public presentation only. Existing layouts, visibility and interactions remain owned by their templates. */
/* Do not move these variables to :root: the WordPress and travel-admin interfaces are separate products. */
:is(#tripchina-root, #tcyf-consent, body.tcps-retained-faq, body.tcps-independent-xiaojing, body.tcps-independent-xiaoxiao, body.tcps-independent-article) {
  --tcps-ink: #222;
  --tcps-muted: #60656b;
  --tcps-blue: #0868cf;
  --tcps-blue-hover: #0055ad;
  --tcps-paper: #fff;
  --tcps-line: #e2e6eb;
  --tcps-surface: #f5f7fa;
  --tcps-tint: #f0f6ff;
  --tcps-font: Arial, "PingFang SC", "Microsoft YaHei", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --tc-interface-font: var(--tcps-font);
  color: var(--tcps-ink);
  background-color: var(--tcps-paper);
  font-family: var(--tcps-font);
  font-synthesis: none;
}
/* Theme tokens use --muted as a surface. Independent templates use that name for text, so never share them. */
:is(#tripchina-root, body.tcps-retained-faq) {
  --background: var(--tcps-paper);
  --foreground: var(--tcps-ink);
  --card: var(--tcps-paper);
  --card-foreground: var(--tcps-ink);
  --popover: var(--tcps-paper);
  --popover-foreground: var(--tcps-ink);
  --primary: var(--tcps-blue);
  --primary-foreground: #fff;
  --secondary: var(--tcps-surface);
  --secondary-foreground: var(--tcps-ink);
  --muted: var(--tcps-surface);
  --muted-foreground: var(--tcps-muted);
  --accent: var(--tcps-tint);
  --accent-foreground: var(--tcps-blue-hover);
  --border: var(--tcps-line);
  --input: var(--tcps-line);
  --ring: var(--tcps-blue);
}
html[lang="zh-Hant"] :is(#tripchina-root, #tcyf-consent, body.tcps-retained-faq, body.tcps-independent-xiaojing, body.tcps-independent-xiaoxiao, body.tcps-independent-article) {
  --tcps-font: Arial, "PingFang TC", "Microsoft JhengHei", "PingFang SC", "Microsoft YaHei", sans-serif;
}
body:has(> #tripchina-root) { background: #fff; }
:is(#tripchina-root, body.tcps-retained-faq) :is(h1, h2, h3, h4, h5, h6, .serif, .brand strong, button, input, select, textarea, optgroup) {
  font-family: var(--tcps-font);
}
:is(#tripchina-root, #tcyf-consent, body.tcps-retained-faq, body.tcps-independent-xiaojing, body.tcps-independent-xiaoxiao, body.tcps-independent-article) :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--tcps-blue);
  outline-offset: 3px;
}

/* Shared navigation, cards and text. Photo-overlay exceptions follow these rules. */
:is(#tripchina-root, body.tcps-retained-faq) .topnav {
  background: #fff;
  border-bottom: 1px solid var(--tcps-line);
  color: var(--tcps-ink);
  box-shadow: none;
}
:is(#tripchina-root, body.tcps-retained-faq) .brand,
#tripchina-root :is(.brand strong, .navlinks a, .tc-locale > button) { color: var(--tcps-ink); }
#tripchina-root :is(.brand small, .breadcrumb, .intro > p, .sectionhead p, .tripbody > p, .about-grid p, .policy p, .policy li, .form-note, .form-title p, .english-commercial p, .english-confirmation-intro, .tc-photo-credit, .tc-photo-description) { color: var(--tcps-muted); }
#tripchina-root :is(.navlinks a.active, .navlinks a:hover, .tc-locale > nav a[aria-current="page"], .sectionhead .more, .article-prose a, .policy a, .checkline a, .english-terms-link, .article-sources a) { color: var(--tcps-blue); }
#tripchina-root :is(.intro h1, .sectionhead h2, .tripbody h3, .route-cover h1, .article-prose h2, .article-prose h3, .about-grid h2, .policy h2, .policy h3, .form-title h2, .english-commercial h2, .english-route-notes h3) { color: var(--tcps-ink); letter-spacing: normal; }
#tripchina-root :is(.panel, .trip-card, .faq-grid details, .itinerary-days details, .itinerary-days article, .discovery-filter-panel, .comparison-scroll, .mobile-guide-toc, .english-confirmation-grid > div) {
  background: #fff;
  border-color: var(--tcps-line);
}
#tripchina-root :is(.route-cover, .english-route-notes, .english-route-inquiry, .compact-inquiry .inquiry-details) { background: var(--tcps-surface); border-color: var(--tcps-line); }
#tripchina-root :is(.charter-promo, .journey-cta) { background: var(--tcps-surface); border-color: var(--tcps-line); }
#tripchina-root :is(.route-cover p, .itinerary-days article p, .faq-grid details p, .article-prose, .compact-inquiry .inquiry-details summary span) { color: var(--tcps-muted); }
#tripchina-root :is(.faq-grid summary, .mobile-guide-toc summary, .compact-inquiry .inquiry-details summary, .checkline, .form-title, .comparison-table th, .comparison-table h2) { color: var(--tcps-ink); }
#tripchina-root :is(.itinerary-days summary small, .itinerary-days article > span, .form-title > span, .tc-product-type) { color: var(--tcps-blue); }
#tripchina-root .eyebrow { letter-spacing: normal; text-transform: none; color: #60656b; font-weight: 500; }
#tripchina-root :is(.itinerary-days .daybadge, .discovery-nav > span, .discovery-type-tabs button.active, .route-choice-actions button.is-selected, .discovery-pagination .active) {
  background: var(--tcps-tint);
  border-color: var(--tcps-blue);
  color: var(--tcps-blue);
}
#tripchina-root :is(.article-prose blockquote, .tc-product-note) { background: var(--tcps-surface); border-color: var(--tcps-blue); color: var(--tcps-ink); }
#tripchina-root :is(.article-prose table th, .comparison-table th:first-child) { background: var(--tcps-surface); }
#tripchina-root :is(.article-prose table th, .article-prose table td, .comparison-table th, .comparison-table td) { border-color: var(--tcps-line); }
#tripchina-root :is(.discovery-nav a, .discovery-type-tabs button, .discovery-results-bar, .comparison-table td, .route-choice-actions button, .discovery-pagination button, .mobile-guide-toc nav a) { color: var(--tcps-muted); }
#tripchina-root :is(.discovery-type-tabs button.active, .route-choice-actions button.is-selected, .discovery-pagination button.active, .mobile-guide-toc nav a:hover) { color: var(--tcps-blue); }

#tripchina-root :is(.article-layout article p, .article > section p, .daybody p, .article-title p, .guide-card p, .charter-promo p, .journey-cta p, .route-planning-notes p, .route-day-conditions p, .charter-types p, .contact-grid p, .cookie-banner p, .compact-inquiry .field-help, .inquiry-ad-choice, .english-commercial .panel p) { color: var(--tcps-muted); }
#tripchina-root :is(.article-title > span, .sticky-quote small, .compact-inquiry .field-optional, .searchfield span) { color: var(--tcps-muted); }
#tripchina-root :is(.searchfield label, .searchfield input) { color: var(--tcps-ink); }
#tripchina-root :is(.searchfield svg, .highlight-grid > div > span, .steps > div > span) { color: var(--tcps-blue); }

/* Primary blue / secondary outline. WhatsApp keeps its recognizable channel colour. */
:is(#tripchina-root, body.tcps-retained-faq) :is(.btn, .btn.gold) {
  background: var(--tcps-blue);
  border-color: var(--tcps-blue);
  color: #fff;
  box-shadow: none;
  text-shadow: none;
}
:is(#tripchina-root, body.tcps-retained-faq) :is(.btn:hover, .btn.gold:hover) { background: var(--tcps-blue-hover); border-color: var(--tcps-blue-hover); color: #fff; }
:is(#tripchina-root, body.tcps-retained-faq) .btn.outline { background: #fff; border-color: var(--tcps-blue); color: var(--tcps-blue); }
:is(#tripchina-root, body.tcps-retained-faq) .btn.outline:hover { background: var(--tcps-tint); color: var(--tcps-blue-hover); }
#tripchina-root .btn.whatsapp-btn { background: #087d3a; border-color: #087d3a; color: #fff; }
#tripchina-root .btn.whatsapp-btn:hover { background: #066832; border-color: #066832; color: #fff; }
#tripchina-root .mobilebar > .central .btn { border-color: #fff; }
#tripchina-root :is(.mobilebar a, .footer-cookie-choice) { color: var(--tcps-muted); }
#tripchina-root .mobilebar a[aria-current="page"] { color: var(--tcps-blue); }

/* Form structure, validations, disabled states and submitted/success colours are intentionally preserved. */
#tripchina-root :is(.field input:not([type="checkbox"]):not([type="radio"]), .field select, .field textarea, .discovery-query, .discovery-select select, .discovery-home-search input, .discovery-home-search select) {
  background-color: #fff;
  border-color: #cbd2da;
  color: var(--tcps-ink);
}
#tripchina-root :is(.field input, .field textarea, .field select):disabled { background: var(--tcps-surface); color: var(--tcps-muted); }
#tripchina-root :is(.field input, .field textarea, .field select):focus { outline-color: var(--tcps-blue); }
#tripchina-root :is(.checkline input, .field input[type="checkbox"], .field input[type="radio"]) { accent-color: var(--tcps-blue); }
#tripchina-root .field [aria-invalid="true"] { border-color: var(--destructive, #b53636); }

/* Photo text stays white: no universal heading/p colour rule can overwrite overlays. */
#tripchina-root :is(.hero, .destination-card, .story-hero) { color: #fff; }
#tripchina-root :is(.hero h1, .hero h2, .hero .eyebrow, .hero p, .hero .breadcrumb, .destination-card h3, .destination-card p, .story-hero h1, .story-hero p) { color: #fff; }
#tripchina-root .hero .btn.outline { background: #fff; color: var(--tcps-blue); border-color: #fff; }

/* White footer; preserve channel buttons and the existing mobile safe-area padding. */
#tripchina-root .sitefooter { background: #fff; border-top: 1px solid var(--tcps-line); color: var(--tcps-ink); box-shadow: none; }
#tripchina-root .sitefooter::before { background: none; }
#tripchina-root .sitefooter :is(.brand, .brand strong, h2, h3) { color: var(--tcps-ink); }
#tripchina-root .sitefooter :is(.brand small, p, a:not(.btn), .footer-contact > span, .copyright, .tc-footer-registration, .footer-cookie-choice) { color: var(--tcps-muted); }
#tripchina-root .sitefooter a:not(.btn):hover { color: var(--tcps-blue); }
#tripchina-root .copyright { border-top-color: var(--tcps-line); }

/* Main-site gallery/consent portals are outside #tripchina-root when opened. */
body:has(> #tripchina-root) :is(.tc-consent, .tc-gallery-dialog, .tc-locale-suggestion) {
  --tcps-blue: #0868cf;
  background-color: #fff;
  border-color: #e2e6eb;
  color: #222;
  font-family: Arial, "PingFang SC", "Microsoft YaHei", "PingFang TC", "Microsoft JhengHei", sans-serif;
}
html[lang="zh-Hant"] body:has(> #tripchina-root) :is(.tc-consent, .tc-gallery-dialog, .tc-locale-suggestion) { font-family: Arial, "PingFang TC", "Microsoft JhengHei", "PingFang SC", "Microsoft YaHei", sans-serif; }
body:has(> #tripchina-root) .tc-consent :is(h2, h3, label, p) { color: #222; }
body:has(> #tripchina-root) .tc-consent :is(p, small) { color: #60656b; }
body:has(> #tripchina-root) .tc-consent :is(a, .tc-consent-actions button) { color: #0868cf; }
body:has(> #tripchina-root) .tc-consent-actions button { background: #fff; border-color: #0868cf; }
body:has(> #tripchina-root) .tc-consent-actions button:hover { background: #f0f6ff; }
body:has(> #tripchina-root) .tc-gallery-stage { background: #f5f7fa; }
body:has(> #tripchina-root) .tc-gallery-dialog :is(.tc-photo-credit, .tc-photo-description) { color: #60656b; }

/* Yunnan's checked server-rendered experience: recolour, do not re-layout or re-render. */
#tcyf-yunnan-page, #tcyf-consent {
  --ynr-ink: #222;
  --ynr-muted: #60656b;
  --ynr-green: #0868cf;
  --ynr-line: #e2e6eb;
  --ynr-paper: #fff;
  --ynr-sand: #f5f7fa;
  color: #222;
  font-family: var(--tcps-font);
}
#tcyf-yunnan-page :is(.ynr-hero, .ynr-header, .ynr-footer) { background: #fff; }
#tcyf-yunnan-page :is(.ynr-brand, h1, h2, h3) { color: #222; }
#tcyf-yunnan-page :is(.ynr-kicker, .ynr-caption, figcaption, .ynr-breadcrumb, .ynr-footer, .ynr-footer p) { color: #60656b; }
#tcyf-yunnan-page .ynr-kicker { letter-spacing: normal; }
#tcyf-yunnan-page .ynr-hotel-card { background: #f5f7fa; border-top-color: #0868cf; }
#tcyf-yunnan-page .ynr-hotel-card a { color: #0868cf; border-color: #0868cf; }
#tcyf-yunnan-page :is(.ynr-quote, .ynr-steps > li) { border-color: #e2e6eb; }
#tcyf-yunnan-page :is(.ynr-steps > li::before, .ynr-day summary > span, .ynr-day summary::after) { color: #0868cf; }
#tcyf-yunnan-page .ynr-button, #tcyf-consent .ynr-button { background: #fff; color: #0868cf; border-color: #0868cf; }
#tcyf-yunnan-page .ynr-button:hover, #tcyf-consent .ynr-button:hover { background: #f0f6ff; border-color: #0055ad; color: #0055ad; }
#tcyf-yunnan-page .ynr-primary, #tcyf-consent .ynr-primary { background: #0868cf; border-color: #0868cf; color: #fff; }
#tcyf-yunnan-page .ynr-primary:hover, #tcyf-consent .ynr-primary:hover { background: #0055ad; color: #fff; }
#tcyf-yunnan-page .ynr-hero .ynr-contact .ynr-button { background: none; border: 0; }
#tcyf-yunnan-page .ynr-whatsapp { color: #087d3a; border-color: #087d3a; }
#tcyf-yunnan-page .ynr-whatsapp:hover { background: #eff8f2; color: #066832; border-color: #066832; }
#tcyf-yunnan-page .ynr-button:disabled, #tcyf-consent .ynr-button:disabled, #tcyf-yunnan-page .ynr-button[aria-disabled="true"], #tcyf-yunnan-page .ynr-button.ynr-disabled { background: #f5f7fa; border-color: #d5dae0; color: #60656b; }
#tcyf-yunnan-page :is(.ynr-filters button, [data-ynr-filter]) { background: #fff; border-color: #cbd2da; color: #60656b; }
#tcyf-yunnan-page [data-ynr-filter][aria-pressed="true"] { background: #0868cf; border-color: #0868cf; color: #fff; }
#tcyf-yunnan-page .ynr-faq :is(summary, h2, h3) { color: #222; }
#tcyf-yunnan-page .ynr-faq p { color: #60656b; }
#tcyf-consent .ynr-privacy { background: #fff; border-color: #e2e6eb; }
#tcyf-consent :is(.ynr-privacy > p, .ynr-privacy-links, .ynr-privacy-links a) { color: #60656b; }
#tcyf-consent .ynr-privacy-links a:hover { color: #0868cf; }

/* Retained FAQs have no app root, so only the exact server-recognised FAQ gets this marker. */
body.tcps-retained-faq { margin: 0; background: #fff; }
body.tcps-retained-faq .policy p { color: #60656b; }
body.tcps-retained-faq main a:not(.btn) { color: #0868cf; }

/* Independent campaign templates: body marker is injected only for audited exact routes. */
body.tcps-independent-xiaojing {
  --burgundy: #0868cf;
  --burgundy-dark: #0055ad;
  --gold: #0868cf;
  --gold-dark: #0055ad;
  --cream: #f5f7fa;
  --ink: #222;
  --muted: #60656b;
  --line: #e2e6eb;
  --sans: var(--tcps-font);
  --serif: var(--tcps-font);
  background: #fff;
}
body.tcps-independent-xiaojing :is(.site-header, .site-footer, .section-nav, .mobile-contact-bar) { background: #fff; color: #222; border-color: #e2e6eb; box-shadow: none; }
body.tcps-independent-xiaojing :is(.brand, .brand small, .header-nav > a:not(.button)) { color: #222; }
/* These two QR captions sit on white navigation surfaces; the scenic hero caption remains white. */
body.tcps-independent-xiaojing :is(.xj-line-qr--header, .xj-line-qr--mobile-bar) > figcaption { color: #60656b; }
body.tcps-independent-xiaojing .header-nav > a:hover:not(.button) { color: #0868cf; border-color: #0868cf; }
body.tcps-independent-xiaojing :is(.button-gold, .button-burgundy) { background: #0868cf; color: #fff; border-color: #0868cf; }
body.tcps-independent-xiaojing :is(.button-gold:hover, .button-burgundy:hover) { background: #0055ad; color: #fff; border-color: #0055ad; }
body.tcps-independent-xiaojing .button-outline { background: #fff; border-color: #0868cf; color: #0868cf; }
body.tcps-independent-xiaojing .button-outline:hover { background: #f0f6ff; }
body.tcps-independent-xiaojing :is(.price-panel, .day-card, .hotel-table td, .hotel-table th, .fee-table td, .fee-table th, .contact-dialog, .itinerary-dialog, .xj-request-form, .xj-comment-form) { border-color: #e2e6eb; }
body.tcps-independent-xiaojing :is(.facts-strip, .contact-section, .day-hotel, .booking-facts, .quote-notes) { background: #f5f7fa; }
body.tcps-independent-xiaojing :is(.hero-shell, .hero-shell h1, .hero-shell p, .hero-eyebrow, .hero-destinations) { color: #fff; }
body.tcps-independent-xiaojing .hero-shell .button-gold { color: #fff; }
body.tcps-independent-xiaojing :is(.contact-id button, .copy-itinerary, .text-button, .price-detail-link, .hotel-detail a) { color: #0868cf; }
body.tcps-independent-xiaojing :is(.xj-field input, .xj-field select, .xj-field textarea) { color: #222; border-color: #cbd2da; }
body.tcps-independent-xiaojing :is(.xiaojing-measurement-choice, .xj-privacy-section) { background: #fff; border-color: #e2e6eb; color: #222; }
body.tcps-independent-xiaojing .xiaojing-measurement-actions button { background: #fff; color: #0868cf; border-color: #0868cf; }

body.tcps-independent-xiaoxiao {
  --orange: #0868cf;
  --orange-dark: #0055ad;
  --ink: #222;
  --muted: #60656b;
  --line: #e2e6eb;
  font-family: var(--tcps-font);
  background: #fff;
}
body.tcps-independent-xiaoxiao :is(.question-block h1, .answer-body h2, .answer-body h3, .question-description, .answer-body p, .request-title h2, .consult-panel) { color: #222; }
body.tcps-independent-xiaoxiao :is(.orange-button, .mobile-consult > button, .follow-button) { background: #0868cf; border-color: #0868cf; color: #fff; }
body.tcps-independent-xiaoxiao :is(.orange-button:hover, .mobile-consult > button:hover, .follow-button:hover) { background: #0055ad; color: #fff; }
body.tcps-independent-xiaoxiao :is(.inline-link, .question-row h3, .reply-row strong, .info-dialog a, .answer-author strong, .reference-price, .twd-result) { color: #0868cf; }
body.tcps-independent-xiaoxiao :is(.topic-tags a, .reply-row, .booking-notice, .service-trust, .hero-consult) { background: #f5f7fa; border-color: #e2e6eb; color: #222; }
body.tcps-independent-xiaoxiao .sidebar-tags { background: #f0f6ff; color: #0055ad; }
body.tcps-independent-xiaoxiao .wechat-copy { background: #f0f6ff; color: #0055ad; }
body.tcps-independent-xiaoxiao .wechat-copy:hover { background: #e3efff; }
body.tcps-independent-xiaoxiao :is(.page-footer, .article-photo figcaption, .food-photos figcaption, .related-intro, .sidebar-question, .scan-title, .sidebar-id, .question-author, .request-label, .request-bottom > span) { color: #60656b; }
body.tcps-independent-xiaoxiao .contact-tabs button[aria-selected="true"] { color: #0868cf; border-color: #0868cf; }
body.tcps-independent-xiaoxiao :is(.measurement-choice, .consult-panel, .contact-dialog, .info-dialog) { background: #fff; color: #222; border-color: #e2e6eb; }
body.tcps-independent-xiaoxiao .measurement-choice button { border-color: #0868cf; }

/* Sichuan / Xiamen share the verified article template, with independent runtime identities. */
body.tcps-independent-article {
  --red: #0868cf;
  --blue: #0868cf;
  --ink: #222;
  --muted: #60656b;
  --line: #e2e6eb;
  --font: var(--tcps-font);
  background: #fff;
}
body.tcps-independent-article :is(.site-header, .side-box, .footer, .mobile-bar, .dialog, .consent) { background: #fff; border-color: #e2e6eb; color: #222; }
body.tcps-independent-article :is(.header-inner, .side-box p, .footer button) { color: #60656b; }
body.tcps-independent-article :is(.question h1, .answer h2, .answer h3, .brand, .side-box h2) { color: #222; }
body.tcps-independent-article :is(.question-sub, .answer p, .route-list p, .faq details p, .footer, .contact-id) { color: #60656b; }
body.tcps-independent-article :is(.opening-contact, .mode-tabs button[aria-selected="true"], .tag) { background: #f0f6ff; color: #0055ad; border-color: #0868cf; }
body.tcps-independent-article :is(.btn:not(.wa):not(.line), .orange-button, .mobile-bar > button) { background: #0868cf; color: #fff; border-color: #0868cf; }
body.tcps-independent-article :is(.btn:not(.wa):not(.line):hover, .orange-button:hover, .mobile-bar > button:hover) { background: #0055ad; color: #fff; }
body.tcps-independent-article .btn.wx { background: #fff; color: #0868cf; border-color: #0868cf; }
body.tcps-independent-article .btn.wx:hover { background: #f0f6ff; color: #0055ad; }
body.tcps-independent-article :is(.copy, .wechat-id, .faq summary, .route-list strong) { color: #0868cf; }
body.tcps-independent-article :is(.request-form input, .request-form textarea, .request-form select) { color: #222; border-color: #cbd2da; }

/* Mobile input sizes prevent browser zoom; do not change fixed navigation, dialogs or horizontal table scrolling. */
@media (max-width: 720px) {
  #tripchina-root :is(.field input, .field select, .field textarea, .discovery-query input, .discovery-select select) { font-size: 16px; }
  :is(body.tcps-independent-xiaojing, body.tcps-independent-xiaoxiao, body.tcps-independent-article) :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { font-size: 16px; }
  :is(#tripchina-root, body.tcps-retained-faq) :is(.sectionhead h2, .tripbody h3, .route-cover h1) { overflow-wrap: break-word; }
  #tripchina-root :is(.tc-footer-registration-label, .tc-footer-registration-value) { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  :is(#tripchina-root, #tcyf-consent, body.tcps-retained-faq, body.tcps-independent-xiaojing, body.tcps-independent-xiaoxiao, body.tcps-independent-article) { scroll-behavior: auto; }
}

/* Destination text cards use the full card width across public and journey renderers. */
.destination-guide-grid { align-items: start; }
.destination-guide-grid > .guide-card.destination-guide-card { align-self: start; min-width: 0; height: auto; }
.destination-guide-grid > .guide-card.destination-guide-text { display: block !important; grid-template-columns: minmax(0, 1fr) !important; min-height: 0; }
.destination-guide-grid > .guide-card.destination-guide-text > div { width: auto; min-width: 0; max-width: none; grid-column: 1 / -1; }
.destination-guide-grid > .guide-card.destination-guide-text > .overline,
.destination-guide-grid > .guide-card.destination-guide-text > div > .overline { display: none; }
.destination-guide-grid > .guide-card.destination-guide-text > div > h3 { margin-top: 0; }
