:root { --lxtm-accent: #b83b5e; }

/* ---------- Tour cards ---------- */
.lxtm-tour-grid { display: grid; grid-template-columns: repeat(var(--lxtm-cols, 4), 1fr); gap: 24px; }
@media (max-width: 900px) { .lxtm-tour-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .lxtm-tour-grid { grid-template-columns: 1fr; } }

.lxtm-tour-card { display: block; text-decoration: none; color: inherit; border-radius: 16px; overflow: hidden; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.08); transition: transform .2s ease, box-shadow .2s ease; display: flex; flex-direction: column; height: 100%; }
.lxtm-tour-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.12); }
.lxtm-tour-card-img { aspect-ratio: 4 / 5; overflow: hidden; flex-shrink: 0; position: relative; }
.lxtm-tour-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lxtm-card-carousel { position: relative; width: 100%; height: 100%; }
.lxtm-card-carousel-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; }
.lxtm-card-carousel-slide.lxtm-active { opacity: 1; }

/* ---------- Single tour page gallery carousel ---------- */
.lxtm-single-carousel-wrap { position: relative; }
.lxtm-single-carousel { position: relative; width: 100%; aspect-ratio: 1/1; overflow: hidden; border-radius: 6px; background: #f5f5f4; }
.lxtm-single-carousel-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .7s ease; }
.lxtm-single-carousel-slide.lxtm-active { opacity: 1; }
.lxtm-single-carousel-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lxtm-single-carousel-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 1px solid #eee; box-shadow: 0 2px 10px rgba(0,0,0,.14); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 5; color: var(--lxtm-accent); padding: 0; }
.lxtm-single-carousel-arrow:hover { background: var(--lxtm-accent); color: #fff; }
.lxtm-single-carousel-arrow.prev { left: 10px; }
.lxtm-single-carousel-arrow.next { right: 10px; }
.lxtm-single-carousel-arrow svg { width: 15px; height: 15px; }
.lxtm-tour-card-body { padding: 16px 18px 20px; display: flex; flex-direction: column; flex: 1; }
.lxtm-tour-card-body h3 { margin: 0 0 4px; font-size: 18px; }
.lxtm-tour-card-subtitle { margin: 0 0 10px; color: #767676; font-size: 14px; }
.lxtm-tour-card-price { margin: 0 0 8px; font-size: 13px; }
.lxtm-tour-card-price strong { color: var(--lxtm-accent); }
.lxtm-tour-card-footer { display: flex; gap: 14px; font-size: 13px; color: #555; flex-wrap: wrap; margin-top: auto; padding-top: 8px; }
.lxtm-tour-card-footer .dashicons { font-size: 15px; width: 15px; height: 15px; vertical-align: -2px; }

/* ---------- Trip details ---------- */
.lxtm-page-subtitle { font-size: 16px; color: #666; margin: 0; }
.lxtm-trip-style { background: #f7e9ee; color: var(--lxtm-accent); border-radius: 999px; padding: 3px 12px; font-size: 12px; margin-right: 8px; }
/* Back to full width like before (constraining it to the left column's width
   left an odd empty gap next to it on tours with a longer subtitle) — just a
   light highlighted box around the same line. */
.lxtm-subtitle-box { background: #faf7f8; border: 1px solid #f0e6ec; border-radius: 10px; padding: 10px 16px; margin: 4px 0 18px; }

/* Simple, subtler highlighted box around the long description — deliberately
   lighter than .lxtm-section-card so it doesn't read as "just another box". */
.lxtm-description-box { background: #fcfbfb; border: 1px solid #f2eef0; border-radius: 8px; padding: 14px 18px; margin: 16px 0; }
.lxtm-description-box .lxtm-description { margin: 0; }

/* Shared "highlighted section" card treatment — icon + light accent box,
   used for Highlights, USP, Ideal for, What's included, Add-ons,
   Physical activity, Points to be noted, Cancellation policy. */
.lxtm-section-card { background: #faf7f8; border: 1px solid #f0e6ec; border-radius: 10px; padding: 16px 18px; margin: 0 0 16px; }
.lxtm-section-card h3, .lxtm-section-card h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 15px; color: var(--lxtm-accent); }
.lxtm-section-card h3 .dashicons, .lxtm-section-card h4 .dashicons { color: var(--lxtm-accent); width: 18px; height: 18px; font-size: 18px; }
/* Collapsible section-cards (What's included, Points to be noted, Cancellation
   policy) — closed by default, unlike the Itinerary <details> which opens by
   default; same visual language (icon + label) as the h3/h4 header above.
   The arrow is drawn ourselves (::before) instead of relying on the browser's
   native <summary> marker: `display: flex` on a <summary> silently drops
   that native marker in Chromium, which is why it showed inconsistently. */
.lxtm-collapsible-section > summary { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: var(--lxtm-accent); cursor: pointer; list-style: none; }
.lxtm-collapsible-section > summary::-webkit-details-marker { display: none; }
.lxtm-collapsible-section > summary::before { content: ''; flex: 0 0 auto; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 6px solid var(--lxtm-accent); transition: transform .15s ease; }
.lxtm-collapsible-section[open] > summary::before { transform: rotate(90deg); }
.lxtm-collapsible-section > summary .dashicons { color: var(--lxtm-accent); width: 18px; height: 18px; font-size: 18px; }
.lxtm-collapsible-section[open] > summary { margin-bottom: 8px; }
.lxtm-highlights ul { margin: 0; padding-left: 20px; }
.lxtm-highlights li { margin-bottom: 4px; }
.lxtm-inclusions { margin: 0 0 16px; }
.lxtm-yes-list li, .lxtm-no-list li { list-style: none; padding-left: 22px; position: relative; margin-bottom: 6px; }
.lxtm-yes-list li::before { content: "✓"; position: absolute; left: 0; color: #1e9e75; }
.lxtm-no-list li::before { content: "✕"; position: absolute; left: 0; color: #c0392b; }
.lxtm-inclusions ul { margin: 0; padding: 0; }
.lxtm-usp p, .lxtm-ideal-for p, .lxtm-addons p, .lxtm-physical-activity p { margin: 0; font-size: 14px; color: #444; }
.lxtm-points-to-note ul { margin: 0; padding-left: 20px; }
.lxtm-points-to-note li { margin-bottom: 4px; }

/* ---------- Itinerary ---------- */
.lxtm-itinerary { border: 1px solid #e6e6e6; border-radius: 12px; padding: 18px 22px; margin: 24px 0; }
.lxtm-itinerary summary { font-size: 20px; font-weight: 600; cursor: pointer; }
.lxtm-itinerary-timeline { margin-top: 16px; position: relative; padding-left: 34px; }
.lxtm-itin-stop { position: relative; padding-bottom: 22px; }
.lxtm-itin-stop:not(:last-child)::before { content: ""; position: absolute; left: -22px; top: 26px; bottom: -4px; width: 1px; background: #ddd; }
.lxtm-itin-marker { position: absolute; left: -34px; top: 0; width: 24px; height: 24px; border-radius: 50%; background: var(--lxtm-accent); color: #fff; font-size: 12px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.lxtm-itin-passby .lxtm-itin-marker { width: 8px; height: 8px; left: -27px; top: 6px; }
.lxtm-itin-content h4 { margin: 0 0 4px; font-size: 15px; }
.lxtm-itin-content p { margin: 0 0 4px; color: #444; font-size: 14px; }
.lxtm-itin-meta { color: #888 !important; font-size: 12px !important; }
.lxtm-itin-tag { color: #888; font-weight: 400; font-size: 12px; }

/* ---------- Reviews ---------- */
.lxtm-reviews { margin: 28px 0; }
.lxtm-reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 12px; }
@media (max-width: 760px) { .lxtm-reviews-grid { grid-template-columns: 1fr; } }
.lxtm-review-card { border: 1px solid #eee; border-radius: 10px; padding: 16px; }
.lxtm-review-stars { color: #f2a900; letter-spacing: 2px; }
.lxtm-review-text { font-size: 14px; color: #333; }
.lxtm-review-author { font-size: 13px; color: #777; margin: 0; }
.lxtm-review-source { font-style: italic; }
.lxtm-review-verified { margin-left: 8px; color: #1e6b30; font-weight: 600; font-size: 12px; text-decoration: none; }
.lxtm-review-verified:hover { text-decoration: underline; }

/* ---------- WhatsApp ---------- */
.lxtm-wa-floating { position: fixed; right: 20px; bottom: 20px; width: 56px; height: 56px; border-radius: 50%; background: #25D366; color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0,0,0,0.2); z-index: 9999; text-decoration: none; }
.lxtm-wa-floating .dashicons { font-size: 28px; width: 28px; height: 28px; }
.lxtm-wa-static { display: flex; gap: 10px; margin: 14px 0; flex-wrap: wrap; }
.lxtm-wa-btn { display: inline-flex; align-items: center; gap: 6px; background: #25D366; color: #fff; padding: 10px 16px; border-radius: 8px; text-decoration: none; font-size: 14px; }
.lxtm-wa-btn-outline { background: transparent; border: 1px solid #25D366; color: #128C4A; }

/* ---------- Currency switch ---------- */
.lxtm-currency-switch { display: inline-flex; border: 1px solid #ddd; border-radius: 8px; overflow: hidden; margin: 10px 0; }
.lxtm-currency-switch a { padding: 6px 14px; text-decoration: none; font-size: 13px; color: #444; }
.lxtm-currency-switch a.active { background: var(--lxtm-accent); color: #fff; }

/* ---------- Single product meta line ---------- */
.lxtm-single-meta { display: flex; gap: 10px; flex-wrap: wrap; margin: 10px 0 16px; }
.lxtm-meta-pill { background: #f5f5f4; border-radius: 999px; padding: 6px 12px; font-size: 13px; color: #444; }
.lxtm-meta-pill em { font-style: normal; color: #888; }
.lxtm-meta-pill-duration { background: #f7e9ee; color: var(--lxtm-accent); border: 1px solid #f0c9d6; font-weight: 600; }
.lxtm-meta-pill-duration .dashicons { color: var(--lxtm-accent); }
.lxtm-meta-pill-duration strong { font-weight: 700; margin-right: 2px; }
.lxtm-meta-pill-duration em { color: var(--lxtm-accent); opacity: .75; }

/* ---------- Booking widget (matches reference layout) ---------- */
.lxtm-booking-form { border: 1px solid #eee; border-radius: 16px; padding: 22px; background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,0.05); max-width: 420px; box-sizing: border-box; }
.lxtm-price-head { margin-bottom: 14px; }
.lxtm-from-label { font-size: 12px; color: #888; text-transform: uppercase; letter-spacing: 0.03em; }
.lxtm-from-price { font-size: 32px; font-weight: 700; color: var(--lxtm-accent); line-height: 1.2; }
.lxtm-subtotal { font-size: 13px; color: #888; }

.lxtm-trust-badges { list-style: none; margin: 14px 0; padding: 0; border-bottom: 1px solid #eee; padding-bottom: 14px; }
.lxtm-trust-badges li { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 6px; color: #333; }
.lxtm-check { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: var(--lxtm-accent); color: #fff; font-size: 11px; flex-shrink: 0; }

.lxtm-form-group { margin-bottom: 16px; }
.lxtm-form-group > label { display: block; font-weight: 600; font-size: 13px; margin-bottom: 6px; color: #222; }
.lxtm-form-group input[type="date"], .lxtm-form-group input[type="text"], .lxtm-form-group select, .lxtm-form-group textarea { width: 100%; box-sizing: border-box; border: 1px solid #ddd; border-radius: 8px; padding: 10px 12px; font-size: 14px; }
.lxtm-fixed-date { background: #f5f5f4; padding: 10px 12px; border-radius: 8px; font-weight: 600; }
.lxtm-error { color: #8a2424; background: #fcf0f1; border: 1px solid #e8b3b3; border-radius: 8px; padding: 8px 12px; font-size: 13px; display: block; margin-top: 6px; }
.lxtm-error:empty { display: none; padding: 0; border: none; margin: 0; }

.lxtm-stepper { display: flex; align-items: center; gap: 10px; }
.lxtm-stepper button { width: 34px; height: 34px; border-radius: 50%; border: 1px solid #ddd; background: #fff; font-size: 18px; cursor: pointer; line-height: 1; }
.lxtm-stepper button:hover { background: #f7e9ee; border-color: var(--lxtm-accent); color: var(--lxtm-accent); }
.lxtm-stepper input { width: 50px; text-align: center; border: 1px solid #ddd; border-radius: 8px; padding: 8px 4px; font-size: 14px; }

.lxtm-radio-pill { display: inline-flex; align-items: center; gap: 6px; margin-right: 16px; font-weight: 400; font-size: 14px; }

.lxtm-note-box { background: #f7e9ee; border-radius: 8px; padding: 12px 14px; font-size: 13px; color: #444; margin: 10px 0; }
.lxtm-ask-badge { background: #fdf2e0; border: 1px solid #f0d6a0; color: #8a5a00; border-radius: 8px; padding: 12px 14px; font-size: 14px; font-weight: 600; }
.lxtm-meeting-card { background: #faf7f8; border-radius: 8px; padding: 12px 14px; }
.lxtm-meeting-label { font-weight: 600; font-size: 13px; margin-bottom: 4px; }
.lxtm-meeting-addr { font-size: 13px; color: #555; margin-bottom: 6px; }
.lxtm-directions { color: var(--lxtm-accent); font-size: 13px; text-decoration: none; font-weight: 600; }
.lxtm-meeting-map { position: relative; width: 100%; padding-top: 56%; margin-top: 12px; border-radius: 8px; overflow: hidden; }
.lxtm-meeting-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.lxtm-inline { display: inline-flex; align-items: center; gap: 4px; font-weight: 400; margin-right: 10px; font-size: 13px; }
.lxtm-under24-prompt { background: #fff8e6; border: 1px solid #f2d98a; border-radius: 8px; padding: 10px 12px; font-size: 13px; margin-top: 10px; }

/* ---------- Filter ---------- */
.lxtm-filter-wrap { display: grid; grid-template-columns: 240px 1fr; gap: 30px; }
@media (max-width: 800px) { .lxtm-filter-wrap { grid-template-columns: 1fr; } }
.lxtm-filter-panel h4 { margin: 16px 0 6px; font-size: 14px; }
.lxtm-filter-panel h4:first-child { margin-top: 0; }
.lxtm-filter-check { display: block; font-size: 14px; margin-bottom: 4px; font-weight: 400; }
.lxtm-price-range { display: flex; gap: 8px; }
.lxtm-price-range input { width: 90px; }
.lxtm-filter-panel .lxtm-btn { margin-top: 14px; margin-right: 8px; }
.lxtm-filter-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; font-size: 14px; }

/* ---------- No black/empty space on any device ---------- */
.lxtm-booking-form, .lxtm-tour-grid, .lxtm-filter-wrap, .lxtm-itinerary, .lxtm-reviews { width: 100%; max-width: 100%; }
@media (max-width: 480px) { .lxtm-booking-form { padding: 16px; border-radius: 12px; } }
img { max-width: 100%; height: auto; }

/* ---------- Under-24hr WhatsApp handoff ---------- */
.lxtm-under24-block { margin-top: 10px; }
.lxtm-wa-confirm-btn { display: flex; align-items: center; justify-content: center; gap: 8px; background: #25D366; color: #fff; border-radius: 10px; padding: 12px; text-decoration: none; font-weight: 700; font-size: 14px; }

/* ---------- Cost breakdown ---------- */
.lxtm-breakdown { margin-top: 8px; }
.lxtm-breakdown-list { list-style: none; margin: 0; padding: 0; }
.lxtm-breakdown-list li { display: flex; justify-content: space-between; font-size: 12px; color: #666; padding: 2px 0; }

/* ---------- Local tours lineup carousel ---------- */
.lxtm-lineup-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; border-bottom: 1px solid #eee; padding-bottom: 10px; }
.lxtm-lineup-tab { background: transparent; border: none; padding: 8px 14px; font-size: 13px; font-weight: 600; color: #888; cursor: pointer; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.03em; }
.lxtm-lineup-tab:hover { background: #f7e9ee; color: var(--lxtm-accent); }
.lxtm-lineup-tab.active { background: var(--lxtm-accent); color: #fff; }
.lxtm-lineup-panel { display: none; }
.lxtm-lineup-panel.active { display: block; }
.lxtm-lineup-carousel { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 10px; -webkit-overflow-scrolling: touch; }
.lxtm-lineup-item { flex: 0 0 240px; scroll-snap-align: start; }
.lxtm-lineup-item .lxtm-tour-card { height: 100%; }
@media (max-width: 560px) { .lxtm-lineup-item { flex-basis: 200px; } }

/* ---------- Native long description (shown between Highlights and Included) ---------- */
.lxtm-description { margin: 16px 0; font-size: 14px; line-height: 1.6; color: #444; }
.lxtm-description-collapsible { max-height: 320px; overflow: hidden; position: relative; transition: max-height .3s ease; }
.lxtm-description-collapsible.lxtm-collapsed::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 60px; background: linear-gradient(rgba(255,255,255,0), #fff); }
.lxtm-description-collapsible.lxtm-expanded { max-height: none; }
.lxtm-description-toggle { background: none; border: none; color: var(--lxtm-accent); font-weight: 600; font-size: 13px; cursor: pointer; padding: 8px 0 0; }
.lxtm-description p { margin: 0 0 12px; }

/* ---------- Job openings ---------- */
.lxtm-job-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 18px; }
.lxtm-job-card { display: block; background: #fff; border: 1px solid #eee; border-radius: 14px; padding: 20px; text-decoration: none; color: inherit; transition: transform .15s ease, box-shadow .15s ease; }
.lxtm-job-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.08); }
.lxtm-job-card h3 { margin: 0 0 6px; font-size: 17px; }
.lxtm-job-card-location { color: #888; font-size: 13px; margin: 0 0 8px; }
.lxtm-job-card-location .dashicons { font-size: 14px; width: 14px; height: 14px; vertical-align: -2px; }
.lxtm-job-card-summary { font-size: 13px; color: #555; margin: 0 0 10px; }
.lxtm-job-card-link { color: var(--lxtm-accent); font-weight: 600; font-size: 13px; }

.lxtm-job-page { max-width: 760px; }
.lxtm-job-location { color: #888; font-size: 14px; }
.lxtm-job-about, .lxtm-job-apply, .lxtm-job-section { margin: 24px 0; }
.lxtm-job-apply { background: #faf7f8; border-radius: 10px; padding: 18px 20px; }
.lxtm-job-section ul { padding-left: 20px; }
.lxtm-job-section li { margin-bottom: 6px; }

/* ---------- Tax-aware breakdown (Subtotal + Tax only, never itemised) ---------- */
.lxtm-breakdown-list li span:first-child { color: #777; }
.lxtm-breakdown-list li.lxtm-breakdown-total { border-top: 1px solid #eee; margin-top: 6px; padding-top: 8px; font-size: 15px; font-weight: 700; color: #222; }
.lxtm-breakdown-list li.lxtm-breakdown-total span { color: var(--lxtm-accent); }
.lxtm-breakdown-list li.lxtm-breakdown-total span:first-child { color: #222; }

/* ---------- Custom calendar (blackout / weekly off-days shown faded, reason on click) ---------- */
.lxtm-cal-wrap { position: relative; }
.lxtm-cal-input { cursor: pointer; background: #fff; width: 100%; box-sizing: border-box; }
.lxtm-cal-popup { display: none; position: absolute; top: calc(100% + 6px); left: 0; z-index: 20; background: #fff; border: 1px solid #ddd; border-radius: 10px; padding: 12px; width: 260px; box-shadow: 0 4px 16px rgba(0,0,0,0.12); }
.lxtm-cal-popup.lxtm-cal-open { display: block; }
.lxtm-cal-head { display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.lxtm-cal-nav { border: none; background: transparent; font-size: 18px; cursor: pointer; padding: 0 6px; color: var(--lxtm-accent); }
.lxtm-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.lxtm-cal-dow { font-size: 11px; color: #999; padding: 4px 0; }
.lxtm-cal-day { font-size: 12px; padding: 6px 0; border-radius: 6px; }
.lxtm-cal-day.lxtm-cal-ok { cursor: pointer; }
.lxtm-cal-day.lxtm-cal-ok:hover { background: #f7e9ee; color: var(--lxtm-accent); }
.lxtm-cal-day.lxtm-cal-disabled { color: #ccc; text-decoration: line-through; cursor: not-allowed; }

.lxtm-tour-card-ask { color: #8a5a00; font-weight: 600; font-size: 13px; }

/* ---------- Itinerary + Description side by side (desktop), stacks on mobile ---------- */
.lxtm-itin-desc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.lxtm-itin-desc-col { min-width: 0; }
@media (max-width: 900px) {
	.lxtm-itin-desc-row { grid-template-columns: 1fr; }
}

/* ---------- Single tour page custom cursor (matches homepage's own ring+dot cursor) ---------- */
.lxtm-cursor-ring, .lxtm-cursor-dot { position: fixed; top: 0; left: 0; pointer-events: none; z-index: 99999; border-radius: 50%; transform: translate(-50%, -50%); transition: width .18s ease, height .18s ease, opacity .18s ease, background .18s ease, border-color .18s ease; }
.lxtm-cursor-ring { width: 34px; height: 34px; border: 1.5px solid var(--lxtm-accent); opacity: 0; }
.lxtm-cursor-dot { width: 6px; height: 6px; background: var(--lxtm-accent); opacity: 0; }
body.lxtm-cursor-on .lxtm-cursor-ring, body.lxtm-cursor-on .lxtm-cursor-dot { opacity: 1; }
body.lxtm-cursor-on, body.lxtm-cursor-on a, body.lxtm-cursor-on button { cursor: none; }
.lxtm-cursor-ring.lxtm-cursor-hover { width: 60px; height: 60px; background: color-mix(in srgb, var(--lxtm-accent) 8%, transparent); }
.lxtm-cursor-dot.lxtm-cursor-hover { opacity: 0; }
@media (pointer: coarse) {
	.lxtm-cursor-ring, .lxtm-cursor-dot { display: none; }
}
