/* =====================================================================
 * Retriever Connect
 * Scoped under .retriever-connect-widget so it won't collide with theme CSS.
 * ===================================================================== */

/* Tour-page wrapper: the tour template's legacy container was sized for
   Ventrata's fixed-height IFRAME (e.g. the BTPS theme sets min-height:1400px
   at desktop widths), which leaves a huge white hole under our self-sizing
   widget. When OUR widget is the wrapper's content (.tour-checkout-rc-widget,
   set by the tour partial), let the wrapper hug the widget so the page text
   below always runs up against it as it expands and contracts. */
.tour-checkout-iframe.tour-checkout-rc-widget { min-height: 0 !important; height: auto !important; }

.retriever-connect-widget {
	--rc-bg: #eef3f7;
	--rc-card: #ffffff;
	--rc-ink: #1f2933;
	--rc-muted: #6b7785;
	--rc-line: #e2e8ef;
	--rc-accent: #d99a2b;       /* gold buttons / primary accent (themeable) */
	--rc-accent-dk: #c4881d;    /* hover shade of the accent (themeable) */
	--rc-on-accent: #ffffff;    /* text/icon colour on accent buttons (themeable) */
	--rc-blue: #4a728c;         /* apply / secondary accent (themeable) */
	--rc-bundle: #4a728c;       /* "Bundle & Save" band background (themeable) */
	--rc-day-disabled-bg: #f3f6f8; /* past/unavailable calendar dates (themeable) */
	--rc-time-bg: #f3f7fa;      /* time-slot panel background (themeable) */
	--rc-green: #4caf50;        /* high availability */
	--rc-amber: #e0a82e;        /* low availability */
	--rc-red: #d9534f;          /* sold out */
	--rc-radius: 14px;          /* card/input corner radius (themeable) */
	--rc-btn-radius: 999px;     /* button corner radius (themeable; 999px = pill) */
	--rc-footer-bg: var(--rc-accent);   /* bottom checkout bar background (themeable) */
	--rc-footer-text: #ffffff;           /* bottom checkout bar text (themeable) */
	--rc-online-price: var(--rc-accent); /* ticket "online price" colour (themeable; defaults to accent) */
	--rc-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; /* themeable */
	--rc-shadow: 0 1px 3px rgba(16, 38, 58, .08);

	box-sizing: border-box;
	position: relative;          /* anchor for the loading overlay */
	max-width: 760px;
	margin: 0 auto;
	color: var(--rc-ink);
	font-family: var(--rc-font);
	font-size: 16px;
	line-height: 1.45;
	/* When the widget scrolls itself into view on a step transition, leave room
	   for a typical sticky site header (~80px). Sites with a taller sticky nav
	   can raise this via a theme override; sites without a sticky header still
	   look fine because the widget just sits a bit lower than the very top. */
	scroll-margin-top: 80px;
}
.retriever-connect-widget *,
.retriever-connect-widget *::before,
.retriever-connect-widget *::after { box-sizing: border-box; }

/* ---- Full-widget loading overlay (e.g. while re-pricing a quantity change) ---- */
.rc-vt-overlay {
	position: absolute; inset: 0; z-index: 60;
	background: rgba(255, 255, 255, .72); backdrop-filter: blur(1px);
	border-radius: var(--rc-radius);
}
/* The box is absolutely positioned; its `top` is set by JS to the centre of the
 * widget's currently-visible band so it's always on screen (left/transform centre it
 * horizontally). The 50% default is the fallback if JS positioning hasn't run yet. */
.rc-vt-overlay__box {
	position: absolute; left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	display: flex; flex-direction: column; align-items: center; gap: 12px;
	background: #fff; padding: 22px 28px; border-radius: 12px;
	box-shadow: 0 8px 28px rgba(16, 38, 58, .18);
	font-weight: 600; color: var(--rc-ink); text-align: center;
	max-width: calc(100% - 24px);
}

/* ---- Loading / spinner ---- */
.rc-vt-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 48px 16px;
	color: var(--rc-muted);
}
.rc-vt-spinner {
	width: 22px; height: 22px;
	border: 3px solid var(--rc-line);
	border-top-color: var(--rc-accent);
	border-radius: 50%;
	animation: rc-spin .8s linear infinite;
	display: inline-block;
}
@keyframes rc-spin { to { transform: rotate(360deg); } }

.rc-vt-error {
	background: #fdecea;
	border: 1px solid #f5c6c2;
	color: #8a1f1a;
	padding: 14px 16px;
	border-radius: 10px;
	margin: 12px 0;
}

/* ---- Panel wrapper ---- */
.rc-vt-panel {
	background: var(--rc-bg);
	border-radius: var(--rc-radius);
	padding: 18px;
}
.rc-vt-panel + .rc-vt-panel { margin-top: 18px; }

.rc-vt-h {
	font-size: 26px;
	font-weight: 800;
	margin: 0 0 6px;
	letter-spacing: -.01em;
}
.rc-vt-sub { color: var(--rc-ink); margin: 0 0 16px; }

/* =====================================================================
 * Product listing
 * ===================================================================== */
.rc-vt-products { display: grid; gap: 16px; }
.rc-vt-product {
	display: grid;
	grid-template-columns: 210px 1fr;
	gap: 0;
	background: var(--rc-card);
	border: 1px solid var(--rc-line);
	border-radius: var(--rc-radius);
	overflow: hidden;
	box-shadow: var(--rc-shadow);
}
.rc-vt-product__media {
	position: relative;
	background: #d7dde3 center/cover no-repeat;
	min-height: 170px;
}
.rc-vt-product__badge {
	position: absolute; top: 0; left: 0;
	background: rgba(31, 41, 51, .55);
	color: #fff;
	font-size: 12px; font-weight: 700;
	letter-spacing: .03em;
	padding: 8px 12px;
	border-bottom-right-radius: 10px;
}
.rc-vt-product__body { padding: 16px 18px; display: flex; flex-direction: column; }
.rc-vt-product__title { font-size: 21px; font-weight: 700; margin: 0 0 6px; line-height: 1.2; }
.rc-vt-stars { color: var(--rc-accent); font-size: 16px; letter-spacing: 2px; margin-bottom: 8px; }
.rc-vt-product__desc {
	color: var(--rc-muted);
	font-size: 14.5px;
	margin: 0 0 12px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.rc-vt-product__price { margin-top: auto; }
.rc-vt-product__price .lbl { color: var(--rc-muted); font-size: 13px; display: block; }
.rc-vt-product__price .amt { font-size: 24px; font-weight: 800; }

/* =====================================================================
 * Buttons
 * ===================================================================== */
.rc-vt-btn {
	display: inline-flex; align-items: center; justify-content: center;
	gap: 8px;
	font-size: 16px; font-weight: 700;
	border: none; border-radius: var(--rc-btn-radius);
	padding: 12px 22px;
	cursor: pointer;
	text-decoration: none;
	transition: background .15s ease, opacity .15s ease, transform .05s ease;
	font-family: inherit;
}
.rc-vt-btn:active { transform: translateY(1px); }
.rc-vt-btn--primary { background: var(--rc-accent); color: var(--rc-on-accent); }
.rc-vt-btn--primary:hover { background: var(--rc-accent-dk); }
.rc-vt-btn--ghost { background: #fff; color: var(--rc-ink); border: 1px solid var(--rc-line); }
.rc-vt-btn--ghost:hover { background: #f6f8fa; }
.rc-vt-btn--block { width: 100%; }
.rc-vt-btn[disabled] { opacity: .5; cursor: not-allowed; }

.rc-vt-product__actions {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 1fr 1.4fr;
	gap: 12px;
	padding: 0 18px 16px;
}

.rc-vt-back {
	background: #fff; border: 1.5px solid var(--rc-blue); color: var(--rc-blue);
	font-weight: 700; cursor: pointer; padding: 8px 16px; font-size: 15px;
	border-radius: var(--rc-btn-radius); margin-bottom: 8px;
	display: inline-flex; align-items: center; gap: 6px; font-family: inherit;
	transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.rc-vt-back:hover { background: var(--rc-blue); color: #fff; text-decoration: none; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); }
.rc-vt-back:focus-visible { outline: 2px solid var(--rc-blue); outline-offset: 2px; }

/* =====================================================================
 * Guest selection
 * ===================================================================== */
.rc-vt-card {
	background: var(--rc-card);
	border: 1px solid var(--rc-line);
	border-radius: var(--rc-radius);
	padding: 18px;
	box-shadow: var(--rc-shadow);
}
.rc-vt-card + .rc-vt-card { margin-top: 16px; }
.rc-vt-section-label { font-weight: 700; color: #3b4b5a; margin-bottom: 8px; font-size: 14px; }
/* Section-label variant used on the Checkout step's Cart Summary header so the
   hold-countdown chip sits flush-right on the same baseline as the heading
   instead of being pinned to the bottom of the panel. */
.rc-vt-section-label--with-meta {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.rc-vt-section-label--with-meta .rc-vt-timer { margin-left: auto; }

/* Card-flow gateway / lazy reveal.

   The Payment card renders express-wallet buttons (Apple Pay / Google Pay /
   Klarna) at the top, then an "or" divider, then a single "Pay with Credit
   Card" gateway button. Clicking the gateway hides it and reveals the
   rc-vt-card-flow container that holds the contact form, Adyen card mount,
   optional save-card consent, and the final Pay button. */
.rc-vt-card-flow { margin-top: 4px; }
.rc-vt-section-label--inset {
	margin-top: 18px;
}
.rc-vt-section-sub {
	font-size: 12px; color: var(--rc-muted, #6b7785);
	margin: -4px 0 10px;
}

/* Option selector */
.rc-vt-select {
	width: 100%;
	font-family: inherit;
	font-size: 16px;
	color: var(--rc-ink);
	background: #fff;
	border: 1px solid var(--rc-line);
	border-radius: 10px;
	padding: 12px 40px 12px 14px;
	cursor: pointer;
	-webkit-appearance: none; -moz-appearance: none; appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23d99a2b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
}
.rc-vt-select:focus { outline: none; border-color: var(--rc-accent); }
.rc-vt-option-desc { color: var(--rc-muted); font-size: 14px; margin: 10px 0 0; }

.rc-vt-guest-row {
	display: flex; align-items: center; justify-content: space-between;
	padding: 12px 0;
	border-bottom: 1px solid var(--rc-line);
}
.rc-vt-guest-row:last-child { border-bottom: none; }
.rc-vt-guest__name { font-size: 19px; font-weight: 700; }
.rc-vt-guest__meta { color: var(--rc-muted); font-size: 13px; }
.rc-vt-guest__price { margin-top: 4px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.rc-vt-guest__price .was { color: var(--rc-muted); font-size: 14px; font-weight: 500; text-decoration: line-through; }
.rc-vt-guest__price .now { color: var(--rc-online-price, var(--rc-accent)); font-size: 16px; font-weight: 700; }

.rc-vt-stepper { display: flex; align-items: center; gap: 14px; }
.rc-vt-step {
	width: 34px; height: 34px; border-radius: 50%;
	border: 1.5px solid var(--rc-accent);
	background: #fff; color: var(--rc-accent);
	font-size: 20px; line-height: 1; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	font-family: inherit;
}
.rc-vt-step:hover { background: #fff7ea; }
.rc-vt-step[disabled] { opacity: .35; cursor: not-allowed; }
.rc-vt-step-val { min-width: 18px; text-align: center; font-size: 17px; font-weight: 600; }

/* Trip protection */
.rc-vt-protection { margin-top: 8px; }
.rc-vt-protection__head {
	display: flex; align-items: center; gap: 10px;
	flex-wrap: nowrap; min-width: 0;
	font-size: 16px;
}
.rc-vt-protection__head > span,
.rc-vt-protection__head .rc-vt-link {
	white-space: nowrap;
	min-width: 0;
}
.rc-vt-protection__head .price { margin-left: auto; font-weight: 700; flex: 0 0 auto; }
/* Tight mobile layout. On a 360–430px wide screen the default 16px label +
   "What's covered?" link + "+ $X.XX" price are wider than the card, so the
   row wraps and looks broken (label, link, and price each end up on their
   own line). Below 600px we drop the row to 13px, shrink the gap, and let
   the label/link truncate with an ellipsis if a translation makes them too
   long — that way the whole "Protect my trip · What's covered? · +$X.XX"
   sits on a single line on every realistic mobile viewport. */
@media (max-width: 600px) {
	.rc-vt-protection__head {
		gap: 6px;
		font-size: 13px;
	}
	.rc-vt-protection__head > span {
		overflow: hidden; text-overflow: ellipsis;
	}
	.rc-vt-protection__head .rc-vt-link {
		font-size: 13px;
		flex: 0 1 auto;
		overflow: hidden; text-overflow: ellipsis;
	}
	.rc-vt-protection__head .price { font-size: 13px; }
	.rc-vt-check { width: 18px; height: 18px; }
	.rc-vt-check[aria-checked="true"]::after {
		left: 4px; top: 1px; width: 5px; height: 9px;
	}
}
.rc-vt-check {
	width: 22px; height: 22px; border-radius: 50%;
	border: 2px solid var(--rc-muted); flex: 0 0 auto;
	cursor: pointer; position: relative; background: #fff;
}
.rc-vt-check[aria-checked="true"] { border-color: var(--rc-accent); background: var(--rc-accent); }
.rc-vt-check[aria-checked="true"]::after {
	content: ""; position: absolute; left: 6px; top: 2px;
	width: 6px; height: 11px; border: solid #fff;
	border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.rc-vt-link { color: var(--rc-blue); text-decoration: underline; cursor: pointer; background: none; border: none; font: inherit; padding: 0; }
.rc-vt-protection__detail {
	font-size: 15px; line-height: 1.55; color: var(--rc-ink); margin-top: 14px;
	border-top: 1px solid var(--rc-line); padding-top: 16px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.rc-vt-protection__h { margin: 0 0 12px; font-size: 20px; font-weight: 800; letter-spacing: -.01em; color: var(--rc-ink); }
.rc-vt-protection__lead { font-weight: 700; color: var(--rc-ink); font-size: var(--rc-protection-font-size, 16px); }
.rc-vt-protection__detail p { margin: 0 0 12px; font-size: var(--rc-protection-font-size, 16px); }
.rc-vt-protection__detail strong { font-weight: 700; }
.rc-vt-protection__close {
	display: inline-block; margin-top: 4px; padding: 4px 2px;
	background: none; border: none; cursor: pointer; font-family: inherit;
	font-size: 15px; font-weight: 600; color: var(--rc-blue); text-decoration: underline;
}
.rc-vt-protection__close:hover { color: var(--rc-ink); }
.rc-vt-hidden { display: none !important; }

/* =====================================================================
 * Calendar
 * ===================================================================== */
.rc-vt-legend { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--rc-muted); margin: 8px 0 12px; }
.rc-vt-legend span { display: inline-flex; align-items: center; gap: 6px; }
.rc-vt-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.rc-vt-dot--high { background: var(--rc-green); }
.rc-vt-dot--low { background: var(--rc-amber); }
.rc-vt-dot--sold { background: var(--rc-red); }

.rc-vt-cal-notice {
	display: flex; align-items: center; gap: 8px;
	background: #fff7ea; border: 1px solid #f0d9a8; color: #8a6310;
	border-radius: 10px; padding: 10px 14px; font-size: 14px; font-weight: 600;
	margin: 4px 0 14px;
}
.rc-vt-cal-notice::before {
	content: ""; width: 8px; height: 8px; border-radius: 50%;
	background: var(--rc-accent); flex: 0 0 auto;
}

.rc-vt-cal-head {
	display: flex; align-items: center; justify-content: center;
	gap: 18px; margin: 6px 0 14px;
}
.rc-vt-cal-head h3 { font-size: 20px; font-weight: 700; margin: 0; min-width: 160px; text-align: center; }
.rc-vt-nav {
	width: 40px; height: 40px; border-radius: 50%;
	border: 1px solid var(--rc-accent); background: var(--rc-accent); color: #fff;
	font-size: 20px; line-height: 1; font-weight: 700; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	font-family: inherit; box-shadow: 0 1px 3px rgba(0,0,0,.18);
	transition: background .12s ease, border-color .12s ease, transform .08s ease;
}
.rc-vt-nav:hover:not([disabled]) { background: var(--rc-accent-dk); border-color: var(--rc-accent-dk); }
.rc-vt-nav:active:not([disabled]) { transform: scale(.94); }
.rc-vt-nav[disabled] { opacity: .3; cursor: not-allowed; }

.rc-vt-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.rc-vt-dow {
	text-align: center; font-size: 13px; font-weight: 700; color: #45525f;
	padding: 8px 0; background: #fff; border-radius: 8px;
}
.rc-vt-day {
	position: relative;
	background: #fff; border: 1px solid var(--rc-line); border-radius: 10px;
	min-height: 64px; padding: 8px 4px 6px;
	display: flex; flex-direction: column; align-items: center; gap: 4px;
	cursor: pointer; font-family: inherit;
	transition: border-color .12s ease, box-shadow .12s ease;
	/* Explicit text colour. Without this, iOS Safari renders <button> text in
	   its system tint blue (the same hue you see on links), which made the
	   calendar day numbers + "$30.00" prices appear blue on mobile. Inherits
	   on desktop browsers and other engines but pins the iOS Safari default
	   to the widget's ink colour. */
	color: var(--rc-ink);
}
.rc-vt-day:hover:not([disabled]) { border-color: var(--rc-accent); }
.rc-vt-day[disabled],
.rc-vt-day.is-empty { background: var(--rc-day-disabled-bg); border-color: transparent; cursor: default; }
.rc-vt-day.is-empty { box-shadow: none; }
.rc-vt-day__num { font-size: 16px; font-weight: 600; }
.rc-vt-day[disabled] .rc-vt-day__num { color: #b6c0c9; }
.rc-vt-day__price { font-size: 11.5px; color: #38454f; }
.rc-vt-day__bar { width: 26px; height: 3px; border-radius: 2px; margin-top: auto; }
.rc-vt-day__bar--high { background: var(--rc-green); }
.rc-vt-day__bar--low { background: var(--rc-amber); }
.rc-vt-day__bar--sold { background: var(--rc-red); }
.rc-vt-day.is-selected { border: 2px solid #3b6f93; box-shadow: 0 0 0 2px rgba(59,111,147,.15); }

/* Calendar loading row (schedule aggregation) */
.rc-vt-cal-loading {
	display: flex; align-items: center; justify-content: center; gap: 10px;
	color: var(--rc-muted); font-size: 14px; padding: 14px 0 2px;
}

/* Showtime container — separates the calendar from the required time choice */
.rc-vt-time-section {
	margin-top: 18px;
	background: var(--rc-time-bg);
	border: 1px solid var(--rc-line);
	border-radius: 12px;
	padding: 14px 16px 16px;
}
.rc-vt-time-section__label {
	font-weight: 700; font-size: 14px; color: #3b4b5a;
	margin-bottom: 12px;
	display: flex; align-items: center; gap: 8px;
}
.rc-vt-time-section__label::before {
	content: ""; width: 8px; height: 8px; border-radius: 50%;
	background: var(--rc-accent); flex: 0 0 auto;
}

/* Time slots — a fixed 4-up grid: every row fills the card edge to edge, each
   button stretching to an equal quarter (1fr) regardless of label width. */
.rc-vt-times { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 0; }
/* The "Checking times…" spinner and the no-availability message render inside
   the same container — span them across all columns so they read full-width. */
.rc-vt-times > .rc-vt-loading, .rc-vt-times > .rc-vt-error { grid-column: 1 / -1; }
/* Narrow phones: 4-up squeezes "10:15 AM" labels below ~420px viewports
   (the panel runs full-width there), so ease to 3-up with a tighter gap. */
@media (max-width: 420px) {
	.rc-vt-times { grid-template-columns: repeat(3, 1fr); gap: 8px; }
}
.rc-vt-time {
	border: 1px solid var(--rc-line); background: #fff;
	border-radius: 10px; padding: 10px 4px; cursor: pointer;
	font-size: 15px; font-family: inherit; font-weight: 600;
	text-align: center; min-width: 0;
	/* Same iOS Safari fix as .rc-vt-day — without an explicit colour,
	   the <button> text rendered in system tint blue on iPhone Safari. */
	color: var(--rc-ink);
}
.rc-vt-time:hover:not([disabled]) { border-color: var(--rc-accent); }
.rc-vt-time.is-selected { border: 2px solid #3b6f93; background: #eef5fa; }
.rc-vt-time[disabled] { opacity: .4; cursor: not-allowed; }
.rc-vt-time small { display: block; color: var(--rc-muted); font-weight: 400; font-size: 12px; }

/* Time-slot urgency tag (hub Widget Configuration): a small pill — e.g. "Limited
   availability" / "Selling fast" — straddling the top edge of nearly-full slots. */
.rc-vt-time { position: relative; }
.rc-vt-times--tagged { padding-top: 8px; } /* headroom so first-row pills aren't clipped */
.rc-vt-time__tag {
	position: absolute; top: -9px; left: 50%; transform: translateX(-50%);
	background: #ffe175; color: #5b4a12;
	font-size: 10.5px; font-weight: 600; font-style: italic; line-height: 1;
	padding: 4px 8px; border-radius: 999px; white-space: nowrap;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
	pointer-events: none; max-width: calc(100% + 8px); overflow: hidden; text-overflow: ellipsis;
}

/* Package scheduler — one row per included item ("Date & Time Selection") */
.rc-vt-pkg-item { border: 1px solid var(--rc-line); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; }
.rc-vt-pkg-item__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.rc-vt-pkg-item__info { flex: 1 1 auto; min-width: 0; }
.rc-vt-pkg-item__title { font-weight: 600; color: #0f172a; }
.rc-vt-pkg-item__sub { color: #64748b; font-size: 13px; margin-top: 2px; }
/* Right column: identical structure on every row — the chosen date/time on top,
   the Change / ✕ controls in a row beneath, everything right-aligned — so a short
   date and a long "… · 1:00 PM" label line up the same way across items. */
.rc-vt-pkg-item__actions { flex: 0 0 auto; max-width: 45%; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; text-align: right; }
.rc-vt-pkg-chosen { color: #1a7f4b; font-weight: 600; font-size: 13px; line-height: 1.4; }
.rc-vt-pkg-item__links { display: flex; align-items: center; gap: 12px; }
.rc-vt-pkg-link { background: none; border: 0; padding: 0; color: #2563eb; font-weight: 600; font-size: 13px; font-family: inherit; cursor: pointer; }
.rc-vt-pkg-link:hover { text-decoration: underline; }
.rc-vt-pkg-x { background: none; border: 0; padding: 0; color: #94a3b8; font-size: 15px; line-height: 1; cursor: pointer; }
.rc-vt-pkg-x:hover { color: #64748b; }
.rc-vt-pkg-pick { border: 0; border-radius: 8px; background: #0f2944; color: #fff; font-weight: 600; font-size: 13px; font-family: inherit; padding: 8px 14px; cursor: pointer; white-space: nowrap; }
.rc-vt-pkg-pick:hover { background: #173a5e; }
.rc-vt-pkg-item__body { margin-top: 12px; }
.rc-vt-pkg-cancel { margin-top: 10px; background: none; border: 0; padding: 0; color: #64748b; font-size: 13px; font-family: inherit; cursor: pointer; }
.rc-vt-pkg-cancel:hover { color: #334155; }

/* Selected showtime's short description (e.g. the day's menu), isolated via Shadow DOM */
.rc-vt-option-desc-box { margin-top: 14px; }
.rc-vt-option-desc-box:empty { margin-top: 0; }
.rc-vt-desc-host { display: block; animation: rc-fade .25s ease; }
@keyframes rc-fade { from { opacity: 0; } to { opacity: 1; } }

/* =====================================================================
 * Sticky footer action bar
 * ===================================================================== */
.rc-vt-footer {
	position: sticky; bottom: 0;
	display: flex; align-items: center; justify-content: space-between;
	gap: 12px;
	background: var(--rc-footer-bg); color: var(--rc-footer-text);
	border-radius: 0 0 var(--rc-radius) var(--rc-radius);
	padding: 16px 22px;
	margin: 18px -18px -18px;
	font-size: 20px; font-weight: 700;
}
.rc-vt-footer__total { font-size: 22px; }
.rc-vt-footer__cta {
	background: none; border: none; color: var(--rc-footer-text); cursor: pointer;
	font-size: 19px; font-weight: 700; display: inline-flex; align-items: center; gap: 8px;
	font-family: inherit;
	padding: 8px 16px; border-radius: 999px; /* reserve pill space in BOTH states so the ready emphasis adds no layout shift */
	transition: opacity .18s ease, background-color .18s ease, box-shadow .18s ease;
	-webkit-tap-highlight-color: transparent;
}
.rc-vt-footer__cta[disabled] { opacity: .55; cursor: not-allowed; }
/* Guidance state: the CTA names the next required step (Choose a date / Choose a time) and
   stays dimmed until the selection is complete. */
.rc-vt-footer__cta--guide { opacity: .55; background: none; box-shadow: none; }
/* Ready state: tickets + date + time chosen — make the CTA pop as the obvious next action. */
.rc-vt-footer__cta--ready { opacity: 1; background: rgba(255, 255, 255, .16); box-shadow: 0 1px 6px rgba(0, 0, 0, .18); }
.rc-vt-timer {
	display: inline-flex; align-items: center; gap: 6px;
	background: #fff; color: var(--rc-ink);
	border-radius: 999px; padding: 6px 14px; font-size: 14px; font-weight: 600;
	transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}
/* Final-minute warning: red text + soft red halo, gently pulsing. */
.rc-vt-timer--warning {
	color: #e02424;
	background: #fdecec;
	box-shadow: 0 0 0 1px rgba(224, 36, 36, .35);
	animation: rc-vt-timer-pulse 1s ease-in-out infinite;
}
@keyframes rc-vt-timer-pulse {
	0%, 100% { box-shadow: 0 0 0 1px rgba(224, 36, 36, .35); }
	50%      { box-shadow: 0 0 0 4px rgba(224, 36, 36, .15); }
}
@media (prefers-reduced-motion: reduce) {
	.rc-vt-timer--warning { animation: none; }
}

/* =====================================================================
 * Cart summary / checkout
 * ===================================================================== */
.rc-vt-cart-line { display: flex; justify-content: space-between; padding: 6px 0; font-size: 15px; }
.rc-vt-cart-line .q { color: var(--rc-muted); }
/* Inline quantity editor rows in the Checkout cart summary. */
.rc-vt-cart-edit-row { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; gap: 12px; }
.rc-vt-cart-line__price { font-variant-numeric: tabular-nums; }
.rc-vt-cart-total {
	display: flex; justify-content: space-between;
	font-size: 20px; font-weight: 800; border-top: 1px solid var(--rc-line);
	margin-top: 10px; padding-top: 12px;
}
.rc-vt-nohidden { color: var(--rc-muted); font-size: 13px; margin-top: 4px; }
.rc-vt-promo { display: flex; gap: 0; margin: 14px 0; }
.rc-vt-promo input {
	flex: 1; border: 1px solid var(--rc-line); border-right: none;
	border-radius: 999px 0 0 999px; padding: 12px 18px; font-size: 15px; font-family: inherit;
}
.rc-vt-promo button {
	border: none; background: var(--rc-blue); color: #fff;
	border-radius: 0 999px 999px 0; padding: 0 26px; cursor: pointer; font-weight: 700; font-family: inherit;
}

/* "X% Online Discount!" gradient banner. Rendered on the booking page when the
   hub has enabled it for this product and Ventrata reports a positive
   offerDiscount. Colours are themed via per-site CSS variables set by the
   widget's inline <style id="rc-vt-theme"> (see print_widget_theme() in the
   plugin PHP); the literal fallback colours here just protect the rendering
   if the inline theme block is somehow missing. */
.rc-vt-discount-callout {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin: 14px 0 18px;
	padding: 14px 18px;
	border-radius: 14px;
	background: linear-gradient(90deg,
		var(--rc-discount-start, #4a9d7d) 0%,
		var(--rc-discount-mid,   #6f6c8c) 52%,
		var(--rc-discount-end,   #c1334d) 100%);
	color: #ffffff;
	font-weight: 800; font-style: italic; font-size: 16px;
	line-height: 1.2;
	box-shadow: 0 1px 0 rgba(0,0,0,.05);
}
.rc-vt-discount-callout__label { flex: 1; }
.rc-vt-discount-callout__badge {
	display: inline-flex; align-items: center;
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--rc-discount-badge, var(--rc-discount-start, #4a9d7d));
	color: #ffffff;
	font-size: 12px; font-weight: 800; font-style: italic; white-space: nowrap;
}

/* Contact form */
.rc-vt-field { margin-bottom: 14px; }
.rc-vt-field label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 5px; }
.rc-vt-field input {
	width: 100%; border: 1px solid var(--rc-line); border-radius: 10px;
	padding: 12px 14px; font-size: 15px; font-family: inherit;
}
.rc-vt-field input:focus { outline: none; border-color: var(--rc-accent); }
.rc-vt-field .err { color: var(--rc-red); font-size: 12.5px; margin-top: 4px; min-height: 0; }

/* Invalid state — applied to the .rc-vt-field wrapper by
   validateContactForm() when a field fails. The error message in .err
   becomes visible, the label and border turn red, and a soft red wash
   sits behind the input to draw the eye when several fields trip at once.
   The state is removed automatically as soon as the operator types
   something into the field (see field() in the JS). */
.rc-vt-field--error label { color: var(--rc-red); }
.rc-vt-field--error input {
	border-color: var(--rc-red);
	background-color: #fff5f5;
}
.rc-vt-field--error input:focus { border-color: var(--rc-red); box-shadow: 0 0 0 3px rgba(220, 38, 38, .15); }
.rc-vt-field--error .err { font-weight: 600; }
.rc-vt-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* "Complete your contact details" inline card.
   Appears AFTER an Apple Pay / Google Pay authorisation when the wallet
   returned blanks for required Ventrata contact fields. The card sits
   inside .rc-vt-pay (the same payment card the wallet buttons live in)
   so we inherit padding + radius; the rules below are only the bits that
   .rc-vt-card doesn't already cover. */
.rc-vt-missing-contact { margin-top: 14px; }
.rc-vt-missing-lead {
	margin: 6px 0 14px;
	font-size: 14px; line-height: 1.5;
	color: var(--rc-ink);
}
.rc-vt-missing-lead strong { color: var(--rc-ink); }
.rc-vt-missing-form .rc-vt-field--missing { margin-bottom: 12px; }
.rc-vt-missing-form .rc-vt-row2 { margin-bottom: 0; }

.rc-vt-terms { text-align: center; font-size: 13px; color: var(--rc-muted); margin-top: 14px; }

/* Confirmation */
.rc-vt-success { text-align: center; padding: 20px 10px; }
.rc-vt-success__check {
	width: 64px; height: 64px; border-radius: 50%;
	background: var(--rc-green); margin: 0 auto 14px; position: relative;
}
.rc-vt-success__check::after {
	content: ""; position: absolute; left: 23px; top: 16px;
	width: 12px; height: 24px; border: solid #fff; border-width: 0 4px 4px 0; transform: rotate(45deg);
}
.rc-vt-success h3 { font-size: 24px; margin: 0 0 8px; }
.rc-vt-ref { font-size: 18px; font-weight: 700; background: #fff; border: 1px dashed var(--rc-line); border-radius: 10px; padding: 12px; display: inline-block; margin: 10px 0; }

/* =====================================================================
 * Step progress indicator
 * ===================================================================== */
.rc-vt-steps {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;          /* always one line */
	width: 100%;
	margin: 4px 0 20px;
}
.rc-vt-step-item {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;             /* never shrink -> labels never wrap */
}
.rc-vt-step-dot {
	width: 28px; height: 28px; flex: 0 0 auto;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	font-size: 13px; font-weight: 700; line-height: 1;
	background: #fff; color: var(--rc-muted);
	border: 2px solid var(--rc-line);
	transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.rc-vt-step-label {
	font-size: 13px; font-weight: 600; color: var(--rc-muted);
	white-space: nowrap; letter-spacing: .01em;
}
.rc-vt-step-line {
	flex: 1 1 auto;            /* fills the gap between steps */
	height: 2px; min-width: 18px;
	background: var(--rc-line);
	margin: 0 10px;
	border-radius: 2px;
	transition: background .2s ease;
}
.rc-vt-step-line.is-done { background: var(--rc-green); }
/* current step */
.rc-vt-step-item.is-active .rc-vt-step-dot { background: var(--rc-accent); color: #fff; border-color: var(--rc-accent); box-shadow: 0 0 0 3px rgba(217,154,43,.18); }
.rc-vt-step-item.is-active .rc-vt-step-label { color: var(--rc-ink); }
/* completed step */
.rc-vt-step-item.is-done .rc-vt-step-dot { background: var(--rc-green); color: #fff; border-color: var(--rc-green); }
.rc-vt-step-item.is-done .rc-vt-step-label { color: var(--rc-ink); }

/* Stay on one line on small screens by trimming spacing, then dropping the
   non-active labels only if it's truly tight. */
@media (max-width: 460px) {
	.rc-vt-step-label { font-size: 12px; }
	.rc-vt-step-line { margin: 0 6px; min-width: 10px; }
	.rc-vt-step-item { gap: 6px; }
}
@media (max-width: 360px) {
	.rc-vt-step-item:not(.is-active) .rc-vt-step-label { display: none; }
}

/* =====================================================================
 * Bundle & Save (cross-sell step)
 * ===================================================================== */
.rc-vt-bundle { display: grid; gap: 14px; }
.rc-vt-bundle__skip {
	background: #fff; border: 1px solid var(--rc-line); border-radius: 999px;
	padding: 12px 18px; cursor: pointer; font-weight: 600; color: var(--rc-ink);
	font-family: inherit; display: inline-flex; align-items: center; gap: 8px;
}
.rc-vt-bundle__skip:hover { border-color: var(--rc-accent); }
.rc-vt-bundle-card {
	display: grid; grid-template-columns: 190px 1fr; column-gap: 18px; align-items: start;
	background: #fff; border: 1px solid var(--rc-line);
	border-radius: 16px; overflow: hidden; box-shadow: var(--rc-shadow);
	position: relative; /* anchor for the sliding info panel */
	padding: 14px;
}
/* Inset, rounded image (not flush to the card edges). */
.rc-vt-bundle-card__media {
	position: relative; background: #cfd8df center/cover no-repeat;
	border-radius: 12px; overflow: hidden; min-height: 150px; align-self: stretch;
}
.rc-vt-bundle-card__save {
	position: absolute; top: 0; left: 0; right: 0;
	background: var(--rc-bundle); color: #fff; font-size: 12px; font-weight: 700; padding: 6px 10px;
	text-align: center;
}
.rc-vt-bundle-card__body { padding: 2px 4px 0 0; }
.rc-vt-bundle-card__title { font-size: 19px; font-weight: 800; line-height: 1.2; margin: 0 0 6px; }

/* Hub-controlled font-size scale for the Bundle & Save view. The PHP side
   adds .rc-vt-bundle-wrap--h-<size> for the main heading and
   .rc-vt-bundle-wrap--b-<size> for the body copy (subhead + card title).
   "default" leaves the baseline above untouched. */
.rc-vt-bundle-wrap--h-xs .rc-vt-bundle__heading { font-size: 18px; }
.rc-vt-bundle-wrap--h-sm .rc-vt-bundle__heading { font-size: 20px; }
.rc-vt-bundle-wrap--h-md .rc-vt-bundle__heading { font-size: 26px; }
.rc-vt-bundle-wrap--h-lg .rc-vt-bundle__heading { font-size: 30px; }
.rc-vt-bundle-wrap--b-xs .rc-vt-bundle__sub,
.rc-vt-bundle-wrap--b-xs .rc-vt-bundle-card__title { font-size: 12px; }
.rc-vt-bundle-wrap--b-xs .rc-vt-bundle-card__title { font-size: 15px; }
.rc-vt-bundle-wrap--b-sm .rc-vt-bundle__sub { font-size: 13px; }
.rc-vt-bundle-wrap--b-sm .rc-vt-bundle-card__title { font-size: 17px; }
.rc-vt-bundle-wrap--b-md .rc-vt-bundle__sub { font-size: 16px; }
.rc-vt-bundle-wrap--b-md .rc-vt-bundle-card__title { font-size: 21px; }
.rc-vt-bundle-wrap--b-lg .rc-vt-bundle__sub { font-size: 18px; }
.rc-vt-bundle-wrap--b-lg .rc-vt-bundle-card__title { font-size: 23px; }
.rc-vt-bundle-card__price .lbl { color: var(--rc-muted); font-size: 12px; display: block; }
.rc-vt-bundle-card__price .was { color: var(--rc-muted); font-size: 15px; font-weight: 500; text-decoration: line-through; margin-right: 6px; }
.rc-vt-bundle-card__price .amt { font-size: 22px; font-weight: 800; }
.rc-vt-bundle-card__actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 14px; }
/* Orange "+" accent on the More info button. */
.rc-vt-btn__plus { color: var(--rc-accent); font-weight: 800; font-size: 18px; line-height: 1; }
.rc-vt-bundle-card.is-added { outline: 2px solid var(--rc-green); }

/* Inline "More info": a panel slides up from the bottom to reveal the description. */
.rc-vt-bundle-card__infopanel {
	position: absolute; top: 0; right: 0; bottom: 0; left: 0;
	background: #fff; display: flex; flex-direction: column;
	transform: translateY(100%); /* hidden below the card until opened */
	transition: transform .34s cubic-bezier(.22, .61, .36, 1);
	will-change: transform;
}
.rc-vt-bundle-card.is-info .rc-vt-bundle-card__infopanel { transform: translateY(0); }
.rc-vt-bundle-card__infohead { flex: 0 0 auto; display: flex; align-items: flex-start; gap: 12px; padding: 16px 16px 8px; }
.rc-vt-bundle-card__infotitle { flex: 1; margin: 0; font-size: 18px; font-weight: 800; line-height: 1.25; letter-spacing: -.01em; color: var(--rc-ink); }
.rc-vt-bundle-card__infoclose {
	flex: 0 0 auto; width: 28px; height: 28px; border: none; background: none; cursor: pointer;
	font-size: 24px; line-height: 1; color: var(--rc-accent); border-radius: 50%;
}
.rc-vt-bundle-card__infoclose:hover { background: rgba(0,0,0,.05); color: var(--rc-ink); }
.rc-vt-bundle-card__info { flex: 1 1 auto; overflow: auto; padding: 0 18px 18px; font-size: 14.5px; line-height: 1.55; color: var(--rc-ink); }
.rc-vt-bundle-card__info h1, .rc-vt-bundle-card__info h2, .rc-vt-bundle-card__info h3, .rc-vt-bundle-card__info h4 { margin: 0 0 8px; font-size: 15px; font-weight: 800; }
.rc-vt-bundle-card__info p { margin: 0 0 8px; }
.rc-vt-bundle-card__info ul, .rc-vt-bundle-card__info ol { margin: 0 0 8px; padding-left: 20px; }
.rc-vt-bundle-card__info li { margin: 6px 0; }
.rc-vt-bundle-card__info img { max-width: 100%; height: auto; border-radius: 8px; }
@media (prefers-reduced-motion: reduce) {
	.rc-vt-bundle-card__infopanel { transition: none; }
}
.rc-vt-continue-shop { background: #fff; border: 1px solid var(--rc-line); border-radius: 999px; padding: 14px; text-align: center; color: var(--rc-muted); }
.rc-vt-continue-shop a { color: var(--rc-ink); }

/* =====================================================================
 * Checkout / Adyen payment (Components flow: wallets + card)
 * ===================================================================== */
.rc-vt-pay { text-align: left; }
.rc-vt-pay__title { font-weight: 600; margin: 4px 0 10px; font-size: 15px; }

/* Express wallets (Apple Pay / Google Pay) sit at the very top of the card. */
.rc-vt-wallets { display: flex; flex-direction: column; gap: 10px; margin-bottom: 4px; }
.rc-vt-wallets__hint { text-align: center; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--rc-muted); }
.rc-vt-wallet { width: 100%; min-height: 44px; }
/* Adyen renders the native wallet buttons inside these mounts; let them fill width. */
.rc-vt-wallet .adyen-checkout__paywithgoogle,
.rc-vt-wallet .adyen-checkout__applepay__button,
.rc-vt-wallet > div { width: 100% !important; }
.rc-vt-wallet .adyen-checkout__applepay__button { min-height: 44px; }

/* "or pay by card" divider between the wallets and the card form. */
.rc-vt-pay-divider { display: flex; align-items: center; gap: 12px; margin: 16px 0 14px; color: var(--rc-muted); font-size: 13px; }
.rc-vt-pay-divider::before,
.rc-vt-pay-divider::after { content: ""; flex: 1; height: 1px; background: var(--rc-line); }

/* Adyen Card component renders its own iframes inside this mount. The mount is a
 * positioned context so that even if a theme forces the secured-field iframes to
 * position:absolute, they anchor HERE (inside the card) rather than flying down
 * over the Pay button / terms. */
.rc-vt-card-component { margin-top: 4px; position: relative; }
.rc-vt-pay-status { color: var(--rc-muted); font-size: 13px; min-height: 18px; }
.rc-vt-pay-status code { background: rgba(0,0,0,.05); padding: 1px 4px; border-radius: 4px; }

/* ---------------------------------------------------------------------
 * Adyen secured-field iframe guard.
 *
 * The card number, expiry and CVC are <iframe> elements (Adyen "secured
 * fields"). Many WordPress themes / page builders ship a global rule like
 * `iframe { position:absolute }` or set a fixed iframe width/height for
 * video embeds (Elementor, WPBakery, oEmbed wrappers, etc.). Those rules
 * yank Adyen's iframes out of their field boxes, so the placeholders pile
 * up over the Pay button / terms. We re-assert the layout Adyen expects,
 * scoped to our widget so the theme's other iframes are untouched. Height
 * is left to Adyen (it sets it inline), so we never collapse the field.
 * ------------------------------------------------------------------- */
.retriever-connect-widget .adyen-checkout__field { position: relative; }
.retriever-connect-widget .adyen-checkout__input,
.retriever-connect-widget .adyen-checkout__card__cvc__input,
.retriever-connect-widget .adyen-checkout__card__exp-date__input { position: relative !important; overflow: visible; }
/* The secured input lives in a span[data-cse] wrapper holding the iframe. */
.retriever-connect-widget .adyen-checkout__input span[data-cse],
.retriever-connect-widget .adyen-checkout__input > span {
	position: static !important;
	display: block !important;
	width: 100% !important;
}
.retriever-connect-widget .adyen-checkout__input iframe,
.retriever-connect-widget .adyen-checkout__input .js-iframe,
.retriever-connect-widget span[data-cse] iframe {
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
	display: block !important;
	border: 0 !important;
	vertical-align: middle;
}
/* Keep Adyen's own field boxes full-width and from inheriting theme input resets. */
.retriever-connect-widget .adyen-checkout__input { width: 100%; }

/* ---- "Add to Apple Wallet" badge on the confirmation screen ---- */
.rc-vt-success__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; align-items: center; }
.rc-vt-applewallet {
	display: inline-flex; align-items: center; gap: 10px;
	background: #000; color: #fff; text-decoration: none;
	border-radius: 10px; padding: 9px 18px; min-height: 46px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	line-height: 1.05; box-sizing: border-box;
}
.rc-vt-applewallet:hover { background: #1a1a1a; color: #fff; }
.rc-vt-applewallet__logo { flex: 0 0 auto; }
.rc-vt-applewallet__txt { display: flex; flex-direction: column; text-align: left; }
.rc-vt-applewallet__txt small { font-size: 10px; opacity: .9; letter-spacing: .01em; }
.rc-vt-applewallet__txt strong { font-size: 17px; font-weight: 600; letter-spacing: -.01em; }

/* =====================================================================
 * Order-expired modal
 * ===================================================================== */
.rc-vt-modal-overlay {
	position: fixed; top: 0; right: 0; bottom: 0; left: 0;
	background: rgba(15, 23, 42, .55);
	display: flex; align-items: center; justify-content: center;
	padding: 20px; z-index: 999999;
	-webkit-font-smoothing: antialiased;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.rc-vt-modal {
	background: #fff; border-radius: 16px; width: 100%; max-width: 420px;
	padding: 32px 28px; text-align: center;
	box-shadow: 0 24px 64px rgba(0, 0, 0, .32);
	outline: none;
}
.rc-vt-modal__icon {
	width: 48px; height: 48px; margin: 0 auto 18px;
	border: 2px solid #e02424; color: #e02424; border-radius: 50%;
	font-size: 26px; font-weight: 700; line-height: 44px;
}
.rc-vt-modal__title { font-size: 20px; font-weight: 800; margin: 0 0 12px; color: var(--rc-ink); }
.rc-vt-modal__msg { font-size: 15px; line-height: 1.55; color: var(--rc-muted); margin: 0 0 22px; }
.rc-vt-modal__close {
	background: none; border: none; padding: 4px 8px; cursor: pointer;
	color: var(--rc-ink); font-weight: 600; font-size: 15px; font-family: inherit;
	text-decoration: underline;
}
.rc-vt-modal__close:hover { color: #000; }

/* "More info" overlay (product description) */
.rc-vt-infomodal { max-width: 560px; text-align: left; padding: 24px 26px 26px; position: relative; }
.rc-vt-infomodal__head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 12px; }
.rc-vt-infomodal__title { font-size: 21px; font-weight: 800; letter-spacing: -.01em; color: var(--rc-ink); margin: 0; flex: 1; line-height: 1.25; }
.rc-vt-infomodal__x {
	flex: 0 0 auto; width: 30px; height: 30px; border: none; background: none; cursor: pointer;
	font-size: 26px; line-height: 1; color: var(--rc-accent); border-radius: 50%;
}
.rc-vt-infomodal__x:hover { background: rgba(0,0,0,.05); color: var(--rc-ink); }
.rc-vt-infomodal__body { font-size: 15px; line-height: 1.55; color: var(--rc-ink); max-height: 62vh; overflow: auto; }
.rc-vt-infomodal__body p { margin: 0 0 10px; }
.rc-vt-infomodal__body h1, .rc-vt-infomodal__body h2, .rc-vt-infomodal__body h3, .rc-vt-infomodal__body h4 { margin: 0 0 10px; font-size: 16px; font-weight: 800; color: var(--rc-ink); }
.rc-vt-infomodal__body ul, .rc-vt-infomodal__body ol { margin: 0 0 12px; padding-left: 20px; }
.rc-vt-infomodal__body li { margin: 6px 0; }
.rc-vt-infomodal__body img { max-width: 100%; height: auto; border-radius: 8px; }
.rc-vt-infomodal__body a { color: var(--rc-blue); }

/* =====================================================================
 * Responsive
 * ===================================================================== */
@media (max-width: 560px) {
	.rc-vt-product { grid-template-columns: 1fr; }
	.rc-vt-product__media { min-height: 150px; }
	.rc-vt-product__actions { grid-template-columns: 1fr; }
	/* Keep the bundle item horizontal (image left, details right) on mobile
	   rather than stacking — just shrink the image column + gap so the pair
	   still fits a phone width. */
	.rc-vt-bundle-card { grid-template-columns: 104px 1fr; column-gap: 12px; }
	.rc-vt-bundle-card__media { min-height: 104px; }
	.rc-vt-bundle-card__actions { grid-template-columns: 1fr; }
	.rc-vt-row2 { grid-template-columns: 1fr; }
	.rc-vt-h { font-size: 22px; }
	.rc-vt-day { min-height: 58px; }
	.rc-vt-day__price { font-size: 10.5px; }
	.rc-vt-footer { font-size: 18px; padding: 14px 16px; }
}