/**
 * Tour Booking System — front end.
 */

/* ---------------------------------------------------------------- tokens */

:root {
	/* Layout. The theme overrides --tbs-container so the plugin never
	   introduces a second, conflicting content width. */
	--tbs-container: 1200px;
	--tbs-gutter: 20px;

	/* Type */
	--tbs-font: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--tbs-text-xs: .75rem;     /* 12 */
	--tbs-text-sm: .8125rem;   /* 13 */
	--tbs-text-base: .875rem;  /* 14 */
	--tbs-text-md: .9375rem;   /* 15 */
	--tbs-text-lg: 1.0625rem;  /* 17 */
	--tbs-text-xl: 1.25rem;    /* 20 */

	/* Card typography. Tour cards and article cards share one scale so a row
	   of each reads as the same weight of content. */
	--tbs-card-title: 1.0625rem;  /* 17 */
	--tbs-card-title-weight: 650;
	--tbs-card-meta: .8125rem;    /* 13 */
	--tbs-card-micro: .75rem;     /* 12 */
	--tbs-card-price: 1.375rem;   /* 22 */

	/* Spacing — 4px rhythm */
	--tbs-space-1: .25rem;
	--tbs-space-2: .5rem;
	--tbs-space-3: .75rem;
	--tbs-space-4: 1rem;
	--tbs-space-5: 1.25rem;
	--tbs-space-6: 1.5rem;
	--tbs-space-8: 2rem;
	--tbs-space-10: 2.5rem;
	--tbs-space-12: 3rem;
	--tbs-space-16: 4rem;

	/* Colour */
	--tbs-primary: #1668e3;
	--tbs-primary-dark: #0f52bb;
	--tbs-primary-soft: #eef4fe;
	--tbs-accent: #f26522;
	--tbs-accent-dark: #d9541a;
	--tbs-navy: #0f1c33;
	--tbs-ink: #101828;
	--tbs-body: #48566d;
	--tbs-muted: #6b7789;
	--tbs-line: #e6eaf0;
	--tbs-line-strong: #d5dce6;
	--tbs-soft: #f7f9fc;
	--tbs-green: #0f9d58;
	--tbs-green-soft: #e9f7ef;
	--tbs-red: #d92d20;
	--tbs-gold: #f5a623;

	/* Shape */
	--tbs-radius: 16px;
	--tbs-radius-sm: 10px;
	--tbs-radius-xs: 8px;
	--tbs-shadow-xs: 0 1px 2px rgba(16, 24, 40, .05);
	--tbs-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 24px -8px rgba(16, 24, 40, .12);
	--tbs-shadow-lg: 0 4px 6px -2px rgba(16, 24, 40, .04), 0 16px 40px -12px rgba(16, 24, 40, .18);
	--tbs-ring: 0 0 0 3px rgba(22, 104, 227, .16);
}

.tbs-wrap,
.tbs-hero,
.tbs-tours-block,
.tbs-reviews-block,
.tbs-inspiration,
.tbs-site-footer,
.tbs-categories-block {
	font-family: var(--tbs-font);
	color: var(--tbs-ink);
	font-size: var(--tbs-text-md);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.tbs-wrap {
	max-width: var(--tbs-container);
	margin-inline: auto;
	padding: var(--tbs-space-8) var(--tbs-gutter) var(--tbs-space-16);
	box-sizing: border-box;
}

/*
 * Already inside the theme's own container: inherit it instead of building a
 * second one. Astra's `.ast-container` is content-width + its own gutter, so
 * re-applying ours here would double the horizontal padding.
 */
.ast-container .tbs-wrap,
.ast-container .tbs-tours-block,
.ast-container .tbs-inspiration,
.ast-container .tbs-categories-block,
.ast-container .tbs-reviews-block,
.entry-content .tbs-wrap,
.entry-content .tbs-tours-block,
.entry-content .tbs-inspiration,
.entry-content .tbs-categories-block,
.entry-content .tbs-reviews-block {
	max-width: 100%;
	padding-inline: 0;
}

/*
 * Full-bleed blocks break out of that container, so they need their own width
 * and gutter back. The reset above matches `.tbs-reviews-block`, which the
 * soft variant also carries, and its `max-width: 100%` would otherwise clamp
 * the band to the content column instead of the viewport.
 */
.ast-container .tbs-reviews-block--soft,
.entry-content .tbs-reviews-block--soft {
	max-width: 100vw;
	padding-inline: var(--tbs-gutter);
}

.tbs-wrap *,
.tbs-hero *,
.tbs-tours-block *,
.tbs-reviews-block *,
.tbs-inspiration *,
.tbs-site-footer * {
	box-sizing: border-box;
}

/* Full-bleed helper: escape the theme content column without extra markup. */

.tbs-hero,
.tbs-reviews-block--soft,
.tbs-site-footer {
	width: 100vw;
	max-width: 100vw;
	/* Never let a flex parent shrink a full-bleed band back to column width. */
	flex-shrink: 0;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/*
 * Themes commonly underline every link inside the content area — Astra uses
 * `.ast-single-post .entry-content a`, specificity (0,2,1). That is right for
 * prose and wrong for buttons, cards, and chips.
 *
 * Matching that specificity would only win on source order, which any plugin
 * enqueued after us could flip. Each selector below therefore carries one more
 * class than Astra's, so the UI opts out regardless of load order. The doubled
 * `.tbs-btn.tbs-btn` is that extra class where the anchor has no ancestor to
 * lean on.
 */
/* Baseline for themes that do not force an underline. */
.tbs-btn,
.tbs-link,
.tbs-chipbar__item,
.tbs-header-btn,
.tbs-card__media,
.tbs-post-card__media,
.tbs-hero__tile,
.tbs-cart-item__media,
.tbs-card__title a,
.tbs-post-card__title a,
.tbs-cart-item__title a,
.tbs-confirm-items__title a,
.tbs-breadcrumb a,
.tbs-single__meta a,
.tbs-account-actions a,
.tbs-site-footer a {
	text-decoration: none;
}

/*
 * Astra's rule is (0,2,1). Every selector here reaches (0,3,1), so it wins on
 * specificity alone and cannot be flipped by another plugin loading later.
 * The doubled class supplies the third class where the anchor has no useful
 * ancestor of its own.
 */
.entry-content a.tbs-btn.tbs-btn,
.entry-content a.tbs-link.tbs-link,
.entry-content a.tbs-chipbar__item.tbs-chipbar__item,
.entry-content a.tbs-header-btn.tbs-header-btn,
.entry-content a.tbs-card__media.tbs-card__media,
.entry-content a.tbs-post-card__media.tbs-post-card__media,
.entry-content a.tbs-hero__tile.tbs-hero__tile,
.entry-content a.tbs-cart-item__media.tbs-cart-item__media,
.entry-content .tbs-card .tbs-card__title a,
.entry-content .tbs-post-card .tbs-post-card__title a,
.entry-content .tbs-cart-item .tbs-cart-item__title a,
.entry-content .tbs-confirm-items .tbs-confirm-items__title a,
.entry-content .tbs-site-footer .tbs-site-footer__inner a,
.entry-content .tbs-site-footer .tbs-site-footer__bottom a,
.entry-content .tbs-wrap .tbs-breadcrumb a,
.entry-content .tbs-wrap .tbs-single__meta a {
	text-decoration: none;
}

.tbs-card__title a:hover,
.tbs-post-card__title a:hover,
.entry-content .tbs-card .tbs-card__title a:hover,
.entry-content .tbs-post-card .tbs-post-card__title a:hover {
	text-decoration: none;
	color: var(--tbs-primary);
}

/* Prose keeps its underline — that is the one place it belongs. */
.tbs-prose a {
	text-decoration: underline;
	text-underline-offset: .18em;
}

/* ------------------------------------------------------------------ hero */

.tbs-hero {
	background: linear-gradient(180deg, #f7f9fc 0%, #eef2f8 100%);
	padding: var(--tbs-space-12) var(--tbs-gutter);
}

.tbs-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: clamp(2rem, 4vw, 3.5rem);
	align-items: center;
	max-width: var(--tbs-container);
	margin-inline: auto;
}

.tbs-hero__title {
	margin: 0 0 var(--tbs-space-4);
	font-size: clamp(2.125rem, 4.6vw, 3.25rem);
	font-weight: 700;
	letter-spacing: -.035em;
	line-height: 1.04;
	text-wrap: balance;
}

.tbs-hero__accent {
	display: block;
	color: var(--tbs-primary);
}

.tbs-hero__text {
	margin: 0 0 16px;
	max-width: 46ch;
	color: #35405a;
	font-size: 14px;
	line-height: 1.7;
}

.tbs-hero__rating {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 7px;
	font-size: 13px;
	color: var(--tbs-muted);
}

.tbs-hero__rating strong {
	color: var(--tbs-ink);
	font-size: 15px;
}

.tbs-hero .tbs-searchbar {
	max-width: 440px;
}

.tbs-hero__features {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 22px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
	color: var(--tbs-muted);
	font-size: 12px;
	font-weight: 600;
}

.tbs-hero__features li {
	display: flex;
	align-items: center;
	gap: 7px;
}

.tbs-hero__features li::before {
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 999px;
	background: var(--tbs-primary);
}

.tbs-hero__media {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: 14px;
	height: 400px;
}

.tbs-hero__tile {
	position: relative;
	display: block;
	border-radius: 18px;
	overflow: hidden;
	background: #dbe6f4;
	text-decoration: none;
}

.tbs-hero__tile--lead {
	grid-row: span 2;
	align-self: center;
	height: 78%;
}

.tbs-hero__tile img,
.tbs-hero__tile .tbs-image-placeholder {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tbs-hero__tile::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 55%;
	background: linear-gradient(to top, rgba(9, 17, 32, .82), transparent);
}

.tbs-hero__caption {
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 12px;
	z-index: 1;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.35;
	text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tbs-google {
	flex: 0 0 auto;
	vertical-align: -.18em;
}

/* ---------------------------------------------------------------- icons */

.tbs-icon {
	flex: 0 0 auto;
	vertical-align: -.15em;
}

/* --------------------------------------------------------------- buttons */

.tbs-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--tbs-space-2);
	min-height: 44px;
	padding: 0 var(--tbs-space-5);
	border: 1px solid transparent;
	border-radius: 999px;
	font-family: inherit;
	font-size: var(--tbs-text-base);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -.005em;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.tbs-btn:active {
	transform: translateY(1px);
}

.tbs-btn:focus-visible {
	outline: none;
	box-shadow: var(--tbs-ring);
}

/* ------------------------------------------------- theme button reset ----
 *
 * Themes paint every bare <button> as their primary button. Astra does it with
 * `button` (0,0,1) plus `button:hover` and `button:focus` (0,1,1), setting
 * background-color, colour, border-radius and `padding: .6em 1em .4em`.
 *
 * Two things go wrong for our icon buttons:
 *
 * 1. That padding, on a flex item whose `min-width` is `auto`, forces the
 *    automatic minimum size above our declared width — a 34px circle becomes
 *    a ~50px oval.
 * 2. Nothing of ours declares a background for :hover / :focus, so the theme
 *    paints them solid on hover and they *stay* solid after a click, because
 *    focus persists.
 *
 * `.tbs-x:hover` is (0,2,0) and beats `button:hover` (0,1,1), so simply
 * declaring the properties in every state is enough — no !important needed.
 */
.tbs-nav-btn,
.tbs-wish,
.tbs-accordion__toggle,
.tbs-filter-link,
.tbs-chipbar__item,
.tbs-review__more,
.tbs-like,
.tbs-gallery__thumb,
.tbs-cart-item__remove,
.tbs-filters-toggle,
.tbs-option__continue,
.tbs-extra,
.tbs-link {
	font-family: inherit;
	padding: 0;
	background-color: transparent;
}

/* Keep the shapes that do define their own padding. */
.tbs-chipbar__item,
.tbs-filters-toggle {
	padding: 0 var(--tbs-space-4);
}

.tbs-filter-link {
	padding: 0 var(--tbs-space-3);
}

/* Icon buttons that stay white in every state. */
.tbs-nav-btn:hover,
.tbs-nav-btn:focus,
.tbs-nav-btn:focus-visible,
.tbs-nav-btn:active,
.tbs-wish:hover,
.tbs-wish:focus,
.tbs-wish:focus-visible,
.tbs-wish:active,
.tbs-like:hover,
.tbs-like:focus,
.tbs-like:focus-visible,
.tbs-like:active,
.tbs-filters-toggle:hover,
.tbs-filters-toggle:focus,
.tbs-filters-toggle:focus-visible,
.tbs-filters-toggle:active {
	background-color: #fff;
}

/* Buttons that are really just text or a thumbnail. */
.tbs-accordion__toggle:hover,
.tbs-accordion__toggle:focus,
.tbs-accordion__toggle:focus-visible,
.tbs-accordion__toggle:active,
.tbs-review__more:hover,
.tbs-review__more:focus,
.tbs-review__more:focus-visible,
.tbs-review__more:active,
.tbs-cart-item__remove:hover,
.tbs-cart-item__remove:focus,
.tbs-cart-item__remove:focus-visible,
.tbs-cart-item__remove:active,
.tbs-gallery__thumb:hover,
.tbs-gallery__thumb:focus,
.tbs-gallery__thumb:focus-visible,
.tbs-gallery__thumb:active,
.tbs-link:hover,
.tbs-link:focus,
.tbs-link:focus-visible,
.tbs-link:active {
	background-color: transparent;
}

/* A visible focus ring, since the theme's own focus paint is now gone. */
.tbs-nav-btn:focus-visible,
.tbs-wish:focus-visible,
.tbs-like:focus-visible,
.tbs-chipbar__item:focus-visible,
.tbs-filter-link:focus-visible,
.tbs-filters-toggle:focus-visible,
.tbs-accordion__toggle:focus-visible,
.tbs-review__more:focus-visible,
.tbs-cart-item__remove:focus-visible,
.tbs-gallery__thumb:focus-visible,
.tbs-link:focus-visible {
	outline: none;
	box-shadow: var(--tbs-ring);
}

.tbs-btn--primary {
	background: var(--tbs-primary);
	color: #fff;
}

.tbs-btn--primary:hover,
.tbs-btn--primary:focus,
.tbs-btn--primary:active {
	background: var(--tbs-primary-dark);
	color: #fff;
}

.tbs-btn--dark {
	background: var(--tbs-navy);
	color: #fff;
}

.tbs-btn--dark:hover,
.tbs-btn--dark:focus,
.tbs-btn--dark:active {
	background: #1b2c4d;
	color: #fff;
}

.tbs-btn--ghost {
	background: #fff;
	border-color: var(--tbs-line-strong);
	color: var(--tbs-ink);
}

.tbs-btn--ghost:hover,
.tbs-btn--ghost:focus,
.tbs-btn--ghost:active {
	background: var(--tbs-primary-soft);
	border-color: var(--tbs-primary);
	color: var(--tbs-primary);
}

.tbs-btn--accent {
	background: var(--tbs-accent);
	color: #fff;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .06);
}

.tbs-btn--accent:hover,
.tbs-btn--accent:focus,
.tbs-btn--accent:active {
	background: var(--tbs-accent-dark);
	color: #fff;
}

.tbs-btn--accent:focus-visible {
	box-shadow: 0 0 0 3px rgba(242, 101, 34, .28);
}

.tbs-btn--block {
	display: flex;
	width: 100%;
}

.tbs-btn--sm {
	min-height: 36px;
	padding: 0 var(--tbs-space-4);
	font-size: var(--tbs-text-sm);
}

.tbs-btn[disabled],
.tbs-btn.is-busy {
	opacity: .6;
	pointer-events: none;
}

.tbs-link {
	color: var(--tbs-primary);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
}

.tbs-link:hover {
	text-decoration: underline;
}

/*
 * Where .tbs-link renders on a <button> (the review "Read more" toggle),
 * Astra's button:hover/:focus/:active sets colour:#fff. Restating our own
 * colour in every state keeps it legible instead of only while hovered.
 */
.tbs-link:hover,
.tbs-link:focus,
.tbs-link:focus-visible,
.tbs-link:active {
	color: var(--tbs-primary);
}

.tbs-center {
	text-align: center;
	margin-top: 24px;
}

.tbs-muted {
	color: var(--tbs-muted);
	font-size: 13px;
}

/* --------------------------------------------------------------- notices */

.tbs-notice {
	padding: 12px 16px;
	border-radius: var(--tbs-radius-sm);
	font-size: 14px;
	margin-bottom: 14px;
	border: 1px solid transparent;
}

.tbs-notice--error {
	background: #fdecec;
	border-color: #f5c2c2;
	color: #97231f;
}

.tbs-notice--success {
	background: var(--tbs-green-soft);
	border-color: #b7e3c9;
	color: #14663f;
}

.tbs-notice--info {
	background: #eaf2fe;
	border-color: #c3d9f8;
	color: #17427f;
}

/* -------------------------------------------------------------- headings */

.tbs-eyebrow {
	display: flex;
	align-items: center;
	gap: var(--tbs-space-2);
	margin: 0 0 var(--tbs-space-2);
	color: var(--tbs-primary);
	font-size: var(--tbs-text-xs);
	font-weight: 600;
	letter-spacing: .01em;
}

.tbs-block-title,
.tbs-page-title,
.tbs-archive__title {
	margin: 0 0 var(--tbs-space-2);
	font-size: clamp(1.625rem, 3.2vw, 2.25rem);
	font-weight: 700;
	letter-spacing: -.028em;
	line-height: 1.15;
	text-wrap: balance;
}

.tbs-block-subtitle,
.tbs-archive__subtitle {
	margin: 0;
	color: var(--tbs-muted);
	font-size: var(--tbs-text-base);
}

.tbs-block-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--tbs-space-5);
	margin-bottom: var(--tbs-space-6);
	flex-wrap: wrap;
}

.tbs-block-nav {
	display: flex;
	align-items: center;
	gap: 8px;
}

.tbs-nav-btn {
	/* flex-basis pins the circle: as a flex item its automatic minimum size
	   would otherwise grow with whatever padding the theme applies. */
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	min-width: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--tbs-line-strong);
	border-radius: 999px;
	background: #fff;
	color: var(--tbs-ink);
	cursor: pointer;
	transition: border-color .16s ease, color .16s ease, background .16s ease;
}

.tbs-nav-btn:hover,
.tbs-nav-btn:focus,
.tbs-nav-btn:focus-visible,
.tbs-nav-btn:active {
	border-color: var(--tbs-primary);
	color: var(--tbs-primary);
}

.tbs-section {
	margin: var(--tbs-space-12) 0;
}

.tbs-section__title {
	margin: 0 0 var(--tbs-space-5);
	font-size: var(--tbs-text-xl);
	font-weight: 700;
	letter-spacing: -.02em;
}

.tbs-section__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 14px;
}

/* ----------------------------------------------------------------- cards */

.tbs-grid-cards {
	display: grid;
	gap: var(--tbs-space-5);
}

.tbs-grid-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tbs-grid-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tbs-grid-cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tbs-grid-cards--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.tbs-scroller {
	display: flex;
	align-items: stretch;
	gap: var(--tbs-space-5);
	overflow-x: auto;
	padding-bottom: var(--tbs-space-3);
	scroll-snap-type: x mandatory;
	scroll-padding-left: 1px;
	scrollbar-width: thin;
	scrollbar-color: var(--tbs-line-strong) transparent;
}

.tbs-scroller > * {
	flex: 0 0 min(320px, 82%);
	scroll-snap-align: start;
}

.tbs-scroller::-webkit-scrollbar {
	height: 6px;
}

.tbs-scroller::-webkit-scrollbar-thumb {
	background: var(--tbs-line-strong);
	border-radius: 999px;
}

.tbs-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	overflow: hidden;
	box-shadow: var(--tbs-shadow-xs);
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.tbs-card:hover {
	transform: translateY(-3px);
	border-color: var(--tbs-line-strong);
	box-shadow: var(--tbs-shadow-lg);
}

.tbs-card__media img {
	transition: transform .45s ease;
}

.tbs-card:hover .tbs-card__media img {
	transform: scale(1.04);
}

.tbs-card__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 11;
	background: var(--tbs-soft);
	overflow: hidden;
}

.tbs-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tbs-image-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #dbe6f4, #eef3fa);
}

.tbs-card__badge {
	position: absolute;
	top: var(--tbs-space-3);
	left: var(--tbs-space-3);
	padding: 5px 11px;
	border-radius: 999px;
	background: var(--tbs-primary);
	color: #fff;
	font-size: .625rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	box-shadow: 0 2px 6px rgba(16, 24, 40, .18);
}

.tbs-card__badge--best-seller { background: #1668e3; }
.tbs-card__badge--featured    { background: #1668e3; }
.tbs-card__badge--full-day    { background: #0f52bb; }
.tbs-card__badge--recommended { background: #0f9d58; }
.tbs-card__badge--new         { background: #7c3aed; }

.tbs-wish {
	position: absolute;
	top: var(--tbs-space-3);
	right: var(--tbs-space-3);
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, .96);
	backdrop-filter: blur(4px);
	color: var(--tbs-ink);
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(16, 24, 40, .16);
	transition: color .16s ease, transform .16s ease;
}

.tbs-wish:hover,
.tbs-wish:focus,
.tbs-wish:focus-visible,
.tbs-wish:active {
	transform: scale(1.08);
	color: var(--tbs-red);
}

.tbs-wish.is-active {
	color: var(--tbs-red);
}

.tbs-wish.is-active .tbs-icon {
	fill: currentColor;
}

.tbs-wish--inline {
	position: static;
	width: auto;
	height: auto;
	gap: 6px;
	padding: 7px 13px;
	font-size: 13px;
	font-weight: 600;
	box-shadow: none;
	border: 1px solid var(--tbs-line);
}

.tbs-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--tbs-space-2);
	padding: var(--tbs-space-5);
	flex: 1;
}

.tbs-card__location {
	display: flex;
	align-items: center;
	gap: var(--tbs-space-1);
	margin: 0;
	color: var(--tbs-muted);
	font-size: var(--tbs-card-meta);
}

.tbs-card__title {
	margin: 0;
	font-size: var(--tbs-card-title);
	font-weight: var(--tbs-card-title-weight);
	line-height: 1.35;
	letter-spacing: -.015em;
	/* Three lines at 17px, since the card footer is pinned with margin-top:auto
	   the extra height is absorbed and long tour names are no longer clipped. */
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tbs-card__title a {
	color: var(--tbs-ink);
	text-decoration: none;
}

.tbs-card__title a:hover {
	color: var(--tbs-primary);
}

.tbs-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.tbs-chip {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 6px;
	font-size: var(--tbs-card-micro);
	font-weight: 500;
	line-height: 1.35;
	border: 1px solid transparent;
}

.tbs-chip--instant {
	background: var(--tbs-green-soft);
	border-color: #bfe6d0;
	color: #0d7a45;
}

.tbs-chip--new {
	background: #eef4fe;
	border-color: #cbdcfa;
	color: var(--tbs-primary);
}

.tbs-card__features {
	display: flex;
	flex-wrap: wrap;
	gap: 5px 14px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--tbs-muted);
	font-size: var(--tbs-card-meta);
}

.tbs-card__features li {
	display: flex;
	align-items: center;
	gap: 6px;
}

.tbs-card__excerpt {
	margin: 0;
	color: var(--tbs-body);
	font-size: var(--tbs-text-base);
	line-height: 1.6;
}

.tbs-card__footer {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
	padding-top: 11px;
	border-top: 1px solid var(--tbs-line);
}

.tbs-card__price-label {
	display: block;
	margin-bottom: 3px;
	color: var(--tbs-muted);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .055em;
	text-transform: uppercase;
}

/* "US$ 37.00" is a plain space, so a narrow card broke the amount away from its
   symbol. Keeping each amount on one line costs nothing and reads far better. */
.tbs-card__price del {
	color: var(--tbs-muted);
	font-size: var(--tbs-card-meta);
	margin-right: var(--tbs-space-1);
	white-space: nowrap;
}

.tbs-card__price strong {
	font-size: var(--tbs-card-price);
	font-weight: 700;
	letter-spacing: -.025em;
	white-space: nowrap;
}

.tbs-save {
	display: inline-block;
	margin-left: var(--tbs-space-2);
	padding: 3px 8px;
	border-radius: 6px;
	background: #fdeceb;
	color: var(--tbs-red);
	font-size: var(--tbs-card-micro);
	font-weight: 600;
	line-height: 1.35;
}

.tbs-card__new {
	color: var(--tbs-muted);
	font-size: var(--tbs-card-meta);
	font-weight: 500;
}

/*
 * Compact layout — related tours sit in the article column, roughly 230px per
 * card at three across. The template drops the location, chips and feature
 * rows there; what is left is tightened so the card reads as a short teaser
 * rather than a squeezed copy of the archive card.
 */

.tbs-card--compact .tbs-card__body {
	gap: var(--tbs-space-3);
	padding: var(--tbs-space-4);
}

.tbs-card--compact .tbs-card__title {
	-webkit-line-clamp: 2;
}

/* Side by side the price and rating fought over ~100px each. Stacking keeps
   both legible and still leaves the card shorter than it was before. */
.tbs-card--compact .tbs-card__footer {
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
}

/* list layout */

.tbs-card--list {
	flex-direction: row;
	align-items: stretch;
}

.tbs-card--list .tbs-card__media {
	flex: 0 0 240px;
	aspect-ratio: auto;
}

/*
 * Three visual columns from two elements: the body becomes a grid and the
 * footer takes the right-hand track for the full height. Without this the
 * footer stretched across the whole row and left a wide empty gap between the
 * text and the price.
 */
.tbs-card--list .tbs-card__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 190px;
	gap: var(--tbs-space-2) var(--tbs-space-6);
	align-content: start;
	padding: var(--tbs-space-5) var(--tbs-space-6);
}

.tbs-card--list .tbs-card__body > *:not(.tbs-card__footer) {
	grid-column: 1;
}

.tbs-card--list .tbs-card__footer {
	grid-column: 2;
	grid-row: 1 / -1;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	gap: var(--tbs-space-2);
	margin-top: 0;
	padding: 0 0 0 var(--tbs-space-6);
	border-top: 0;
	border-left: 1px solid var(--tbs-line);
	text-align: right;
}

/* The list view has room for a larger heading than the grid. */
.tbs-card--list .tbs-card__title {
	font-size: var(--tbs-text-xl);
	-webkit-line-clamp: 2;
}

.tbs-card--list .tbs-card__excerpt {
	-webkit-line-clamp: 2;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ----------------------------------------------------------------- stars */

.tbs-stars {
	display: inline-flex;
	gap: 1px;
	color: var(--tbs-gold);
	font-size: 13px;
	line-height: 1;
}

.tbs-star--empty { color: #d8dee7; }
.tbs-star--half  { color: var(--tbs-gold); opacity: .55; }

.tbs-rating-count {
	color: var(--tbs-muted);
	font-size: var(--tbs-card-meta);
}

/* ------------------------------------------------------------ search bar */

.tbs-searchbar {
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--tbs-space-2);
	max-width: 540px;
	padding: 6px 6px 6px 44px;
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: 999px;
	box-shadow: var(--tbs-shadow);
	margin-top: var(--tbs-space-5);
	transition: border-color .16s ease, box-shadow .16s ease;
}

.tbs-searchbar:focus-within {
	border-color: var(--tbs-primary);
	box-shadow: var(--tbs-ring), var(--tbs-shadow);
}

.tbs-searchbar__icon {
	position: absolute;
	left: 17px;
	color: var(--tbs-muted);
	display: inline-flex;
}

.tbs-searchbar input[type="search"] {
	flex: 1;
	min-width: 0;
	border: 0;
	outline: 0;
	background: transparent;
	font-family: inherit;
	font-size: var(--tbs-text-base);
	padding: var(--tbs-space-2) 0;
	color: var(--tbs-ink);
}

/* ------------------------------------------------------------- chip bars */

.tbs-chipbar {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	padding: 4px 0 12px;
	scrollbar-width: thin;
}

.tbs-chipbar__item {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: var(--tbs-space-2);
	min-height: 38px;
	padding: 0 var(--tbs-space-4);
	border: 1px solid var(--tbs-line-strong);
	border-radius: 999px;
	background: #fff;
	color: var(--tbs-body);
	font-family: inherit;
	font-size: var(--tbs-text-sm);
	font-weight: 500;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	transition: background .16s ease, border-color .16s ease, color .16s ease;
}

.tbs-chipbar__item:hover,
.tbs-chipbar__item:focus,
.tbs-chipbar__item:focus-visible,
.tbs-chipbar__item:active {
	background-color: #fff;
	border-color: var(--tbs-primary);
	color: var(--tbs-primary);
}

.tbs-chipbar__item:focus-visible {
	outline: none;
	box-shadow: var(--tbs-ring);
}

.tbs-chipbar__item.is-active {
	background: var(--tbs-navy);
	border-color: var(--tbs-navy);
	color: #fff;
	font-weight: 600;
}

.tbs-chipbar--links .tbs-chipbar__item:hover {
	background: var(--tbs-primary);
	border-color: var(--tbs-primary);
}

/* --------------------------------------------------------------- archive */

.tbs-archive__header {
	margin-bottom: 22px;
}

.tbs-archive__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 0;
	flex-wrap: wrap;
}

.tbs-sort select,
.tbs-price-range input {
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius-sm);
	padding: 8px 11px;
	font-size: 13px;
	background: #fff;
	color: var(--tbs-ink);
}

.tbs-archive__layout {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 26px;
	align-items: start;
}

.tbs-filters {
	position: sticky;
	top: var(--tbs-space-5);
	display: flex;
	flex-direction: column;
	gap: var(--tbs-space-6);
	padding: var(--tbs-space-5);
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	box-shadow: var(--tbs-shadow-xs);
}

.tbs-filters__group h3 {
	margin: 0 0 var(--tbs-space-3);
	font-size: var(--tbs-text-base);
	font-weight: 600;
	letter-spacing: -.01em;
}

.tbs-filters__group ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

/* --------------------------------------------------------- checkbox filters */

.tbs-filter-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.tbs-filter-check {
	display: flex;
	align-items: center;
	gap: var(--tbs-space-3);
	min-height: 38px;
	padding: 0 var(--tbs-space-2);
	border-radius: var(--tbs-radius-xs);
	color: var(--tbs-body);
	font-size: var(--tbs-text-sm);
	cursor: pointer;
	transition: background .14s ease, color .14s ease;
}

.tbs-filter-check:hover {
	background: var(--tbs-soft);
	color: var(--tbs-ink);
}

.tbs-filter-check input[type="checkbox"] {
	flex: 0 0 17px;
	width: 17px;
	height: 17px;
	margin: 0;
	accent-color: var(--tbs-primary);
	cursor: pointer;
}

.tbs-filter-check__name {
	flex: 1;
	min-width: 0;
}

.tbs-filter-check:has(input:checked) {
	color: var(--tbs-primary);
	font-weight: 600;
}

.tbs-filter-more {
	display: inline-flex;
	align-items: center;
	gap: var(--tbs-space-2);
	min-height: 38px;
	margin-top: var(--tbs-space-2);
	padding: 0 var(--tbs-space-2);
	border: 0;
	border-radius: var(--tbs-radius-xs);
	background: transparent;
	color: var(--tbs-primary);
	font-family: inherit;
	font-size: var(--tbs-text-sm);
	font-weight: 600;
	cursor: pointer;
}

/*
 * Not part of the sitewide systematic reset (this component predates it), so
 * unlike the others above it needs both background AND colour restated here:
 * without :focus/:active listed, Astra's button:focus wins background-color
 * on the plain (non-hover) base rule too — (0,1,1) beats our unscoped
 * (0,1,0) — leaving an unpredictable accent fill with white-on-white text.
 */
.tbs-filter-more:hover,
.tbs-filter-more:focus,
.tbs-filter-more:focus-visible,
.tbs-filter-more:active {
	background: var(--tbs-primary-soft);
	color: var(--tbs-primary);
}

.tbs-filter-more .tbs-icon {
	transition: transform .18s ease;
}

.tbs-filter-more[aria-expanded="true"] .tbs-icon {
	transform: rotate(90deg);
}

.tbs-filters__reset {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--tbs-space-2);
	width: 100%;
	min-height: 38px;
	border: 1px dashed var(--tbs-line-strong);
	border-radius: var(--tbs-radius-sm);
	background: transparent;
	color: var(--tbs-muted);
	font-family: inherit;
	font-size: var(--tbs-text-sm);
	font-weight: 600;
	cursor: pointer;
}

/* Same gap as .tbs-filter-more above — also outside the systematic reset,
   so background is restated here alongside colour, not just on :hover. */
.tbs-filters__reset:hover,
.tbs-filters__reset:focus,
.tbs-filters__reset:focus-visible,
.tbs-filters__reset:active {
	background: transparent;
	border-color: var(--tbs-red);
	color: var(--tbs-red);
}

/* ------------------------------------------------------------ results grid */

.tbs-results {
	display: grid;
	gap: var(--tbs-space-4);
}

.tbs-results--list {
	grid-template-columns: minmax(0, 1fr);
	gap: var(--tbs-space-4);
}

.tbs-results--grid-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--tbs-space-5);
}

.tbs-results--grid-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--tbs-space-5);
}

.tbs-results .tbs-empty {
	grid-column: 1 / -1;
}

.tbs-filter-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--tbs-space-2);
	width: 100%;
	min-height: 38px;
	padding: 0 var(--tbs-space-3);
	border: 0;
	border-radius: var(--tbs-radius-xs);
	background: transparent;
	color: var(--tbs-body);
	font-family: inherit;
	font-size: var(--tbs-text-sm);
	text-align: left;
	cursor: pointer;
	transition: background .14s ease, color .14s ease;
}

.tbs-filter-link:hover,
.tbs-filter-link:focus,
.tbs-filter-link:focus-visible,
.tbs-filter-link:active {
	background-color: var(--tbs-soft);
	color: var(--tbs-ink);
}

.tbs-filter-link.is-active {
	background: var(--tbs-primary-soft);
	color: var(--tbs-primary);
	font-weight: 600;
}

.tbs-filter-count {
	color: var(--tbs-muted);
	font-size: 11px;
}

.tbs-price-range {
	display: flex;
	gap: 8px;
	margin-bottom: 9px;
}

.tbs-price-range label {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 11px;
	color: var(--tbs-muted);
}

.tbs-price-range input {
	width: 100%;
}

.tbs-empty {
	padding: 40px;
	text-align: center;
	color: var(--tbs-muted);
	background: var(--tbs-soft);
	border-radius: var(--tbs-radius);
}

/* ----------------------------------------------------------- single tour */

.tbs-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-bottom: 12px;
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-breadcrumb a {
	color: var(--tbs-muted);
	text-decoration: none;
}

.tbs-breadcrumb a:hover {
	color: var(--tbs-primary);
}

.tbs-single__headline {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}

.tbs-single__title {
	margin: 0;
	font-size: clamp(1.5rem, 3.2vw, 2.125rem);
	font-weight: 700;
	letter-spacing: -.028em;
	line-height: 1.2;
	text-wrap: balance;
}

.tbs-single__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 18px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
	color: var(--tbs-muted);
	font-size: 13px;
}

.tbs-single__meta li {
	display: flex;
	align-items: center;
	gap: 6px;
}

.tbs-top-rated {
	padding: 3px 9px;
	border-radius: 6px;
	background: var(--tbs-navy);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
}

.tbs-single__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 356px;
	gap: clamp(1.75rem, 3vw, 2.75rem);
	align-items: start;
	margin-top: var(--tbs-space-6);
}

/*
 * Hero and thumbnail column have to end on the same line.
 *
 * The hero used to take its height from the image (capped at 420px) while the
 * tiles kept a fixed 4/3 ratio. The thumbnail grid still stretched to the hero's
 * height, so its two rows grew but the tiles inside them did not — leaving a
 * ~150px void between the rows and another below them. Giving the hero a
 * definite ratio and letting the tiles fill their rows makes both columns the
 * same height by construction rather than by coincidence.
 */
.tbs-gallery {
	display: grid;
	grid-template-columns: 1.8fr 1fr;
	gap: var(--tbs-space-3);
	align-items: stretch;
	margin-bottom: 22px;
}

.tbs-gallery__main {
	aspect-ratio: 16 / 10;
	max-height: 460px;
	overflow: hidden;
	border-radius: var(--tbs-radius);
}

.tbs-gallery__main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--tbs-radius);
	display: block;
}

.tbs-gallery__thumbs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: var(--tbs-space-3);
}

.tbs-gallery__thumb {
	position: relative;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	border-radius: var(--tbs-radius-sm);
	overflow: hidden;
	/* Fills its grid row; the row, not the image, decides the height. */
	height: 100%;
	min-height: 0;
}

.tbs-gallery__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tbs-gallery__more {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(15, 28, 51, .55);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
}

.tbs-prose {
	font-size: 15px;
	line-height: 1.75;
	color: #35405a;
}

.tbs-prose p:first-child { margin-top: 0; }
.tbs-prose p:last-child  { margin-bottom: 0; }

.tbs-info-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.tbs-info-card {
	display: flex;
	gap: var(--tbs-space-4);
	padding: var(--tbs-space-5);
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	background: #fff;
}

.tbs-info-card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	border-radius: 12px;
	background: var(--tbs-primary-soft);
	color: var(--tbs-primary);
}

.tbs-info-card h3 {
	margin: 0 0 var(--tbs-space-1);
	font-size: var(--tbs-text-base);
	font-weight: 600;
	letter-spacing: -.01em;
}

.tbs-info-card p {
	margin: 0;
	color: var(--tbs-muted);
	font-size: var(--tbs-text-sm);
	line-height: 1.65;
}

/* ------------------------------------------------------------- accordion
   These panels now open by default (every guest should see the itinerary
   and what to bring, not just whoever clicks). A hairline under the section
   heading plus one under every open panel read fine when only one panel was
   ever visible at a time; with all six open at once, even a single line
   between each pair still drew a fence across the page every few rows.
   Section rhythm comes entirely from spacing and the bold toggle label now
   — no rule at all. */

.tbs-accordion__item + .tbs-accordion__item {
	margin-top: var(--tbs-space-6, 1.5rem);
}

.tbs-accordion__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--tbs-space-4);
	width: 100%;
	min-height: 56px;
	padding: var(--tbs-space-4) 2px;
	border: 0;
	background: none;
	color: var(--tbs-ink);
	font-family: inherit;
	font-size: var(--tbs-text-md);
	font-weight: 600;
	letter-spacing: -.012em;
	text-align: left;
	cursor: pointer;
}

/*
 * background-color is already reclaimed for every state (see the systematic
 * reset near the top of this file), but hover-only colour coverage left the
 * label white right after a click: a click leaves the button :focus'd, Astra
 * sets colour:#fff on button:focus, and nothing here disagreed for anything
 * but :hover.
 */
.tbs-accordion__toggle:hover,
.tbs-accordion__toggle:focus,
.tbs-accordion__toggle:focus-visible,
.tbs-accordion__toggle:active {
	color: var(--tbs-primary);
}

.tbs-accordion__toggle .tbs-icon {
	transition: transform .18s ease;
	color: var(--tbs-muted);
}

.tbs-accordion__toggle[aria-expanded="true"] .tbs-icon {
	transform: rotate(90deg);
	color: var(--tbs-primary);
}

.tbs-accordion__panel {
	padding: 0 2px 20px;
}

.tbs-ticklist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.tbs-ticklist li {
	display: flex;
	gap: 9px;
	font-size: 14px;
	line-height: 1.6;
	color: #35405a;
}

.tbs-ticklist .tbs-icon {
	margin-top: 3px;
	color: var(--tbs-green);
}

.tbs-ticklist--no .tbs-icon {
	color: var(--tbs-red);
}

.tbs-inex {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.tbs-inex h4 {
	margin: 0 0 10px;
	font-size: 14px;
	font-weight: 700;
}

/*
 * A single connected rail with a dot per step, not a border-left on each
 * <li>. The old per-row border only spanned that row's own height, so the
 * 16px gap between rows broke the line into disconnected floating segments
 * instead of one continuous timeline.
 */
.tbs-itinerary {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.tbs-itinerary::before {
	content: "";
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 3px;
	width: 2px;
	background: var(--tbs-line);
}

.tbs-itinerary li {
	position: relative;
	display: grid;
	grid-template-columns: 130px minmax(0, 1fr);
	gap: 14px;
	padding-left: 20px;
}

.tbs-itinerary li::before {
	content: "";
	position: absolute;
	top: 6px;
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: var(--tbs-primary);
	box-shadow: 0 0 0 3px #fff;
}

.tbs-itinerary__time {
	color: var(--tbs-primary);
	font-size: 13px;
	font-weight: 700;
}

.tbs-itinerary__body strong {
	display: block;
	font-size: 14px;
	margin-bottom: 3px;
}

.tbs-itinerary__body p {
	margin: 0;
	color: var(--tbs-muted);
	font-size: 13px;
	line-height: 1.6;
}

/* -------------------------------------------------------- booking widget */

.tbs-booking {
	position: sticky;
	top: 20px;
}

.tbs-booking__inner {
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	box-shadow: var(--tbs-shadow);
	padding: var(--tbs-space-6);
}

.tbs-booking__from {
	display: block;
	color: var(--tbs-muted);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.tbs-booking__price del {
	color: var(--tbs-muted);
	font-size: 13px;
}

.tbs-booking__amount {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 7px;
}

.tbs-booking__amount strong {
	font-size: 1.75rem;
	font-weight: 700;
	letter-spacing: -.03em;
}

.tbs-booking__unit {
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-booking__tax {
	margin: 4px 0 0;
	color: var(--tbs-muted);
	font-size: 11px;
}

.tbs-booking__form {
	display: flex;
	flex-direction: column;
	gap: 9px;
	margin-top: 16px;
}

.tbs-field-row {
	position: relative;
	display: block;
}

.tbs-field-row__icon {
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--tbs-muted);
	pointer-events: none;
	display: inline-flex;
}

.tbs-booking__control {
	width: 100%;
	min-height: 48px;
	padding: 0 var(--tbs-space-3) 0 46px;
	border: 1px solid var(--tbs-line-strong);
	border-radius: var(--tbs-radius-sm);
	background: var(--tbs-soft);
	font-family: inherit;
	font-size: var(--tbs-text-base);
	font-weight: 500;
	color: var(--tbs-ink);
	appearance: none;
	transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

/*
 * Astra styles form fields as `input[type=text], … input[type=date], select`.
 * An attribute selector counts as a class, so `input[type=date]` scores (0,1,1)
 * and outranked the (0,1,0) rule above — but only for the date field, which is
 * why every other control cleared its icon and that one printed "mm/dd/yyyy"
 * straight through it. `select` in the same list is (0,0,1) and always lost,
 * which is what made the bug look specific to dates.
 *
 * Scoping to the row lifts this to (0,2,0): above Astra, still below anything
 * a site later writes with an id.
 */
.tbs-field-row .tbs-booking__control {
	padding: 0 var(--tbs-space-3) 0 46px;
}

/*
 * Chrome lays the editable date parts out in their own box that carries
 * padding of its own; zeroing it stops the gap being counted twice and keeps
 * "mm/dd/yyyy" on the same left edge as the text in every other field.
 */
.tbs-field-row input[type="date"]::-webkit-datetime-edit {
	padding: 0;
}

.tbs-field-row input[type="date"]::-webkit-calendar-picker-indicator {
	margin-left: var(--tbs-space-2);
	opacity: .55;
	cursor: pointer;
}

.tbs-field-row input[type="date"]::-webkit-calendar-picker-indicator:hover {
	opacity: 1;
}

/* Firefox: the same field family, without the shadow-DOM parts. */
.tbs-field-row input[type="date"] {
	line-height: normal;
}

.tbs-booking__control:hover {
	border-color: var(--tbs-line-strong);
	background: #fff;
}

.tbs-booking__control:focus {
	outline: none;
	background: #fff;
	border-color: var(--tbs-primary);
	box-shadow: var(--tbs-ring);
}

.tbs-booking__addons {
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius-sm);
	padding: 11px 12px;
	margin: 0;
}

.tbs-booking__addons legend {
	padding: 0 4px;
	font-size: 12px;
	font-weight: 700;
	color: var(--tbs-muted);
}

.tbs-addon {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 5px 0;
	font-size: 13px;
}

.tbs-addon__name {
	flex: 1;
}

.tbs-addon__price {
	color: var(--tbs-muted);
	font-size: 12px;
	white-space: nowrap;
}

.tbs-booking__message {
	font-size: 13px;
	line-height: 1.5;
}

.tbs-booking__message.is-error {
	color: #97231f;
}

.tbs-booking__message.is-ok {
	color: #0d7a45;
}

.tbs-booking__quote {
	border-top: 1px dashed var(--tbs-line);
	padding-top: 11px;
}

.tbs-quote-lines {
	list-style: none;
	margin: 0 0 8px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
	font-size: 13px;
	color: var(--tbs-muted);
}

.tbs-quote-lines li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
}

.tbs-quote-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 14px;
	font-weight: 700;
	padding-top: 8px;
	border-top: 1px solid var(--tbs-line);
}

.tbs-quote-total strong {
	font-size: 18px;
}

.tbs-booking__wa {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	margin-top: 4px;
	color: var(--tbs-green);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}

/* --------------------------------------------------------------- reviews */

.tbs-review-summary {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr);
	gap: var(--tbs-space-8);
	align-items: center;
	padding: var(--tbs-space-6);
	background: var(--tbs-soft);
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	margin-bottom: var(--tbs-space-6);
}

.tbs-review-summary__score {
	text-align: center;
}

.tbs-review-summary__score strong {
	display: block;
	font-size: 2.5rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.035em;
}

.tbs-review-summary__score span {
	display: block;
	margin-top: 5px;
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-review-bars {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.tbs-review-bars li {
	display: grid;
	grid-template-columns: 16px minmax(0, 1fr) 36px;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	color: var(--tbs-muted);
}

.tbs-review-bars__track {
	height: 7px;
	border-radius: 999px;
	background: #eef1f6;
	overflow: hidden;
}

.tbs-review-bars__fill {
	display: block;
	height: 100%;
	background: var(--tbs-gold);
}

.tbs-review-bars__count {
	text-align: right;
}

.tbs-review-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.tbs-review {
	padding: var(--tbs-space-5);
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	box-shadow: var(--tbs-shadow-xs);
}

/* Cards in a scroller stretch to the tallest one, so the internals align. */
.tbs-review--compact {
	flex: 0 0 min(330px, 84%);
	display: flex;
	flex-direction: column;
}

.tbs-review--compact .tbs-review__body {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.tbs-review--compact .tbs-review__more {
	margin-top: auto;
	align-self: flex-start;
	padding-top: var(--tbs-space-2);
}

.tbs-review__head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}

.tbs-review__avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	border-radius: 999px;
	background: var(--tbs-navy);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}

.tbs-review__who strong {
	display: block;
	font-size: 14px;
}

.tbs-review__meta {
	color: var(--tbs-muted);
	font-size: 11px;
}

.tbs-review__title {
	margin: 7px 0 5px;
	font-size: 14px;
	font-weight: 700;
}

.tbs-review__text {
	margin: 0;
	color: #35405a;
	font-size: 13px;
	line-height: 1.65;
}

.tbs-review__text.is-clamped {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tbs-review__more {
	margin-top: 5px;
	font-size: 13px;
}

.tbs-review__photos {
	display: flex;
	gap: 7px;
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
	flex-wrap: wrap;
}

.tbs-review__photos img {
	width: 62px;
	height: 62px;
	object-fit: cover;
	border-radius: 8px;
	display: block;
}

.tbs-review__foot {
	margin-top: 11px;
	padding-top: 9px;
	border-top: 1px solid var(--tbs-line);
}

.tbs-like {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	border: 1px solid var(--tbs-line);
	border-radius: 999px;
	background: #fff;
	color: var(--tbs-muted);
	font-size: 12px;
	cursor: pointer;
}

.tbs-like:hover,
.tbs-like:focus,
.tbs-like:focus-visible,
.tbs-like:active,
.tbs-like.is-liked {
	color: var(--tbs-red);
	border-color: #f3c6c6;
}

/* ------------------------------------------------------------ form parts */

.tbs-card-plain {
	padding: 20px;
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
}

.tbs-card-plain h2,
.tbs-card-plain h3 {
	margin-top: 0;
}

.tbs-form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.tbs-form-field {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-bottom: 14px;
}

.tbs-form-label {
	font-size: 13px;
	font-weight: 600;
	color: #35405a;
}

.tbs-form-field input[type="text"],
.tbs-form-field input[type="email"],
.tbs-form-field input[type="tel"],
.tbs-form-field input[type="password"],
.tbs-form-field input[type="number"],
.tbs-form-field input[type="search"],
.tbs-form-field select,
.tbs-form-field textarea {
	width: 100%;
	min-height: 44px;
	padding: var(--tbs-space-3);
	border: 1px solid var(--tbs-line-strong);
	border-radius: var(--tbs-radius-sm);
	background: #fff;
	font-size: var(--tbs-text-base);
	line-height: 1.45;
	color: var(--tbs-ink);
	font-family: inherit;
	transition: border-color .16s ease, box-shadow .16s ease;
}

.tbs-form-field textarea {
	min-height: 92px;
	resize: vertical;
}

.tbs-form-field input::placeholder,
.tbs-form-field textarea::placeholder {
	color: #9aa5b5;
}

.tbs-form-field input:focus,
.tbs-form-field select:focus,
.tbs-form-field textarea:focus {
	outline: none;
	border-color: var(--tbs-primary);
	box-shadow: var(--tbs-ring);
}

.tbs-check {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	margin-bottom: 12px;
}

.tbs-rating-input {
	display: inline-flex;
	flex-direction: row-reverse;
	gap: 3px;
}

.tbs-rating-input input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.tbs-rating-input label {
	font-size: 26px;
	line-height: 1;
	color: #d8dee7;
	cursor: pointer;
}

.tbs-rating-input input:checked ~ label,
.tbs-rating-input label:hover,
.tbs-rating-input label:hover ~ label {
	color: var(--tbs-gold);
}

.tbs-review-form,
.tbs-lookup-form {
	padding: 20px;
	background: var(--tbs-soft);
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	margin-bottom: 22px;
}

.tbs-review-form h3 {
	margin-top: 0;
}

/* ------------------------------------------------------------ cart pages */

.tbs-cart-layout,
.tbs-checkout-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 330px;
	gap: 26px;
	align-items: start;
}

.tbs-cart-items {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.tbs-cart-item {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr) 150px;
	gap: 16px;
	padding: 14px;
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
}

.tbs-cart-item__media img {
	width: 100%;
	height: 110px;
	object-fit: cover;
	border-radius: var(--tbs-radius-sm);
	display: block;
}

.tbs-cart-item__title {
	margin: 0 0 7px;
	font-size: 16px;
	font-weight: 700;
}

.tbs-cart-item__title a {
	color: var(--tbs-ink);
	text-decoration: none;
}

.tbs-cart-item__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 5px 16px;
	list-style: none;
	margin: 0 0 9px;
	padding: 0;
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-cart-item__meta li {
	display: flex;
	align-items: center;
	gap: 5px;
}

.tbs-cart-item__addons {
	list-style: none;
	margin: 0 0 9px;
	padding: 0;
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-cart-item__qty {
	display: flex;
	gap: 12px;
}

.tbs-cart-item__qty label {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 11px;
	color: var(--tbs-muted);
}

.tbs-cart-item__qty input {
	width: 78px;
	padding: 7px 9px;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius-sm);
	font-size: 14px;
}

.tbs-cart-item__side {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
}

.tbs-cart-item__total {
	font-size: 18px;
	font-weight: 800;
}

.tbs-cart-item__remove {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	border: 0;
	background: none;
	color: var(--tbs-muted);
	font-size: 12px;
	cursor: pointer;
}

.tbs-cart-item__remove:hover,
.tbs-cart-item__remove:focus,
.tbs-cart-item__remove:focus-visible,
.tbs-cart-item__remove:active {
	color: var(--tbs-red);
}

.tbs-cart-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
}

.tbs-cart-summary,
.tbs-checkout-summary {
	position: sticky;
	top: var(--tbs-space-5);
	padding: var(--tbs-space-6);
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	box-shadow: var(--tbs-shadow);
}

.tbs-cart-summary h2,
.tbs-checkout-summary h2 {
	margin: 0 0 var(--tbs-space-5);
	font-size: var(--tbs-text-lg);
	font-weight: 700;
	letter-spacing: -.018em;
}

.tbs-summary-lines,
.tbs-summary-items {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 11px;
	font-size: 13px;
}

.tbs-summary-lines li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
}

.tbs-summary-items li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 4px 12px;
	padding-bottom: 11px;
	border-bottom: 1px solid var(--tbs-line);
}

.tbs-summary-items__title {
	font-weight: 600;
}

.tbs-summary-items__meta {
	grid-column: 1;
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-summary-items__price {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: center;
	font-weight: 700;
	white-space: nowrap;
}

.tbs-summary-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: var(--tbs-space-4);
	padding: var(--tbs-space-4) 0;
	border-top: 1px solid var(--tbs-line);
	font-weight: 600;
}

.tbs-summary-total strong {
	font-size: 1.375rem;
	font-weight: 700;
	letter-spacing: -.025em;
}

.tbs-summary-note {
	display: flex;
	align-items: flex-start;
	gap: var(--tbs-space-2);
	margin: var(--tbs-space-4) 0 0;
	color: var(--tbs-muted);
	font-size: var(--tbs-text-xs);
	line-height: 1.55;
}

.tbs-summary-note .tbs-icon {
	margin-top: 2px;
}

.tbs-checkout-section {
	padding: var(--tbs-space-6);
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	margin-bottom: var(--tbs-space-5);
	box-shadow: var(--tbs-shadow-xs);
}

.tbs-checkout-section h2 {
	margin: 0 0 var(--tbs-space-5);
	font-size: var(--tbs-text-lg);
	font-weight: 700;
	letter-spacing: -.018em;
}

.tbs-gateways {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.tbs-gateway {
	border: 1px solid var(--tbs-line-strong);
	border-radius: var(--tbs-radius-sm);
	overflow: hidden;
	transition: border-color .16s ease, box-shadow .16s ease;
}

.tbs-gateway.is-selected {
	border-color: var(--tbs-primary);
	box-shadow: var(--tbs-ring);
}

.tbs-gateway__head {
	display: flex;
	align-items: center;
	gap: var(--tbs-space-3);
	min-height: 56px;
	padding: var(--tbs-space-3) var(--tbs-space-5);
	cursor: pointer;
	font-size: var(--tbs-text-base);
	font-weight: 600;
}

.tbs-gateway__head input[type="radio"] {
	accent-color: var(--tbs-primary);
	width: 18px;
	height: 18px;
}

.tbs-gateway__icon {
	color: var(--tbs-primary);
	display: inline-flex;
}

.tbs-gateway__body {
	padding: 0 15px 15px;
	font-size: 13px;
	color: var(--tbs-muted);
}

.tbs-gateway-desc p {
	margin: 0 0 8px;
}

.tbs-bank-list {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.tbs-bank-item {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	padding: 11px 13px;
	background: var(--tbs-soft);
	border-radius: var(--tbs-radius-sm);
	font-size: 13px;
	color: var(--tbs-ink);
}

.tbs-bank-name {
	font-weight: 700;
}

.tbs-bank-number {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	letter-spacing: .04em;
}

.tbs-bank-holder,
.tbs-bank-meta {
	color: var(--tbs-muted);
}

.tbs-terms {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 14px 0;
	font-size: 12px;
	color: var(--tbs-muted);
}

/* ---------------------------------------------------- confirmation pages */

.tbs-confirmation__hero {
	text-align: center;
	padding: 30px 20px;
	background: var(--tbs-soft);
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	margin-bottom: 22px;
}

.tbs-confirmation__hero.is-paid {
	background: var(--tbs-green-soft);
	border-color: #bfe6d0;
}

.tbs-confirmation__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 58px;
	height: 58px;
	border-radius: 999px;
	background: #fff;
	color: var(--tbs-green);
	margin-bottom: 12px;
	box-shadow: var(--tbs-shadow);
}

.tbs-confirmation__hero h1 {
	margin: 0 0 6px;
	font-size: clamp(21px, 3vw, 28px);
	font-weight: 800;
}

.tbs-confirmation__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.tbs-confirm-items {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tbs-confirm-items li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 4px 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--tbs-line);
}

.tbs-confirm-items__title {
	font-weight: 600;
}

.tbs-confirm-items__title a {
	color: var(--tbs-ink);
	text-decoration: none;
}

.tbs-confirm-items__meta {
	grid-column: 1;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-confirm-items__meta span {
	display: flex;
	align-items: center;
	gap: 5px;
}

.tbs-confirm-items__price {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: center;
	font-weight: 700;
	white-space: nowrap;
}

.tbs-deflist {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 7px 16px;
	margin: 0 0 16px;
	font-size: 13px;
}

.tbs-deflist dt {
	color: var(--tbs-muted);
}

.tbs-deflist dd {
	margin: 0;
	font-weight: 600;
}

.tbs-pill {
	display: inline-flex;
	align-items: center;
	padding: 3px 11px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	background: #eef1f6;
	color: #475467;
}

.tbs-pill.is-pending   { background: #fff4e0; color: #a35a00; }
.tbs-pill.is-hold      { background: #eaf2fe; color: #17427f; }
.tbs-pill.is-paid      { background: var(--tbs-green-soft); color: #0d7a45; }
.tbs-pill.is-done      { background: #e8ecf9; color: #2c3e8c; }
.tbs-pill.is-cancelled { background: #fdecec; color: #97231f; }

.tbs-empty-state {
	text-align: center;
	padding: 54px 20px;
	background: var(--tbs-soft);
	border: 1px dashed var(--tbs-line);
	border-radius: var(--tbs-radius);
	color: var(--tbs-muted);
}

.tbs-empty-state h2 {
	margin: 12px 0 6px;
	font-size: 19px;
	color: var(--tbs-ink);
}

/* --------------------------------------------------------------- account */

.tbs-account-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.tbs-account-actions {
	display: flex;
	gap: 18px;
	margin-bottom: 22px;
}

.tbs-account-bookings {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.tbs-account-booking {
	padding: 16px;
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
}

.tbs-account-booking__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 9px;
}

.tbs-account-booking__items {
	list-style: none;
	margin: 0 0 11px;
	padding: 0;
	font-size: 14px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.tbs-account-booking__foot {
	display: flex;
	align-items: center;
	gap: 16px;
	padding-top: 11px;
	border-top: 1px solid var(--tbs-line);
}

.tbs-account-booking__foot strong {
	margin-right: auto;
	font-size: 17px;
}

/* ------------------------------------------------------- header controls */

.tbs-header-actions {
	display: inline-flex;
	align-items: center;
	gap: var(--tbs-space-2);
	flex-wrap: wrap;
	/*
	 * Themes give menu items a tall line-height to centre them in the header
	 * bar (Astra uses 80px). Inheriting it turns these buttons into ovals, so
	 * the scope resets it and the buttons set their own height.
	 */
	line-height: normal;
}

.tbs-header-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 38px;
	padding: 0 14px;
	border: 1px solid var(--tbs-line-strong);
	border-radius: 999px;
	background: #fff;
	color: var(--tbs-ink);
	font-family: var(--tbs-font);
	font-size: var(--tbs-text-sm);
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
	transition: border-color .16s ease, color .16s ease, background .16s ease;
}

.tbs-header-btn:hover {
	border-color: var(--tbs-primary);
	color: var(--tbs-primary);
}

.tbs-header-btn--dark {
	background: var(--tbs-navy);
	border-color: var(--tbs-navy);
	color: #fff;
}

.tbs-header-btn--dark:hover {
	color: #fff;
	background: #1b2c4d;
}

.tbs-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--tbs-primary);
	color: #fff;
	font-size: .6875rem;
	font-weight: 600;
	line-height: 1;
}

.tbs-header-btn--dark .tbs-count {
	background: rgba(255, 255, 255, .22);
}

/* ---------------------------------------------------- homepage sections */

.tbs-tours-block,
.tbs-inspiration,
.tbs-categories-block {
	max-width: var(--tbs-container);
	margin-inline: auto;
	padding: var(--tbs-space-12) var(--tbs-gutter);
}

.tbs-reviews-block {
	padding: var(--tbs-space-12) var(--tbs-gutter);
}

.tbs-reviews-block--soft {
	background: linear-gradient(180deg, #f2f7fe 0%, #eaf2fd 100%);
}

.tbs-reviews-block__inner {
	max-width: var(--tbs-container);
	margin-inline: auto;
}

.tbs-reviews-block--soft .tbs-review {
	border-color: #d3e2f7;
}

.tbs-reviews-block__cta {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--tbs-space-3);
	margin-top: var(--tbs-space-8);
}

.tbs-reviews-block__cta .tbs-btn--ghost {
	background: rgba(255, 255, 255, .7);
}

.tbs-reviews-block--soft .tbs-nav-btn {
	border-color: #cfdff5;
}

/* -------------------------------------------------------- post / article */

.tbs-post-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	overflow: hidden;
	box-shadow: var(--tbs-shadow);
	transition: transform .18s ease, box-shadow .18s ease;
}

.tbs-post-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 26px rgba(16, 24, 40, .1);
}

.tbs-post-card__media {
	display: block;
	aspect-ratio: 16 / 10;
	background: var(--tbs-soft);
	overflow: hidden;
}

.tbs-post-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tbs-post-card__body {
	padding: var(--tbs-space-5);
}

/* Same micro-label treatment as the tour card's "Starts from". */
.tbs-post-card__label {
	display: block;
	margin-bottom: 3px;
	color: var(--tbs-primary);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .055em;
	text-transform: uppercase;
}

/* Deliberately identical to .tbs-card__title so a row of tours and a row of
   articles read at the same size. */
.tbs-post-card__title {
	margin: 0;
	font-size: var(--tbs-card-title);
	font-weight: var(--tbs-card-title-weight);
	line-height: 1.35;
	letter-spacing: -.015em;
}

.tbs-post-card__title a {
	color: var(--tbs-ink);
	text-decoration: none;
}

.tbs-post-card__title a:hover {
	color: var(--tbs-primary);
}

/* ----------------------------------------------------------- site footer */

.tbs-site-footer {
	background: var(--tbs-navy);
	color: #b7c4d6;
	padding: var(--tbs-space-12) var(--tbs-gutter) var(--tbs-space-6);
	font-size: var(--tbs-text-base);
	line-height: 1.7;
}

/* Explore Bali / Company / My Booking are short lists (2-5 links each) — at
   1fr they were wasting the same width as the brand and contact columns,
   which both carry far more content. Narrowing them tightens the rhythm and
   gives the two content-heavy end columns the room they actually need. */
.tbs-site-footer__inner {
	display: grid;
	grid-template-columns: 1.3fr 0.8fr 0.8fr 0.8fr 1.3fr;
	gap: var(--tbs-space-10);
	max-width: var(--tbs-container);
	margin-inline: auto;
}

/* Sits between the description and the social icons — a smaller gap than
   the ul default reads as "part of the brand block", not its own list. */
/* .tbs-site-footer ul sets flex-direction: column for every other footer
   list — this one needs the icons laid out as a row, so it has to override
   that explicitly rather than relying on display:flex's own default. */
.tbs-site-footer__social {
	display: flex;
	flex-direction: row;
	gap: 8px;
	margin: 0 0 var(--tbs-space-5);
	padding: 0;
	list-style: none;
}

.tbs-site-footer__social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .08);
	color: #cbd5e4;
	transition: background .15s ease, color .15s ease;
}

.tbs-site-footer__social a:hover,
.tbs-site-footer__social a:focus-visible {
	background: var(--tbs-primary, #1668e3);
	color: #fff;
}

.tbs-site-footer__touch-list {
	margin-bottom: var(--tbs-space-5);
}

.tbs-site-footer__touch-list li {
	display: flex;
	align-items: flex-start;
	gap: 9px;
}

.tbs-site-footer__touch-list .tbs-icon {
	flex-shrink: 0;
	margin-top: 2px;
	color: var(--tbs-primary, #4c8dff);
}

.tbs-newsletter__label {
	display: block;
	margin-bottom: 8px;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
}

.tbs-newsletter__row {
	display: flex;
	gap: 8px;
}

.tbs-newsletter__input {
	flex: 1;
	min-width: 0;
	height: 40px;
	padding: 0 12px;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 8px;
	background: rgba(255, 255, 255, .06);
	color: #fff;
	font-size: 13px;
}

.tbs-newsletter__input::placeholder {
	color: #8598b4;
}

.tbs-newsletter__input:focus-visible {
	outline: 2px solid var(--tbs-primary, #4c8dff);
	outline-offset: 1px;
}

.tbs-newsletter__submit {
	flex-shrink: 0;
	height: 40px;
	padding: 0 16px;
	border: 0;
	border-radius: 8px;
	background: var(--tbs-primary, #1668e3);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: background .15s ease, opacity .15s ease;
}

.tbs-newsletter__submit:hover,
.tbs-newsletter__submit:focus-visible {
	background: var(--tbs-primary-dark, #0f4fb0);
}

.tbs-newsletter__submit:disabled {
	opacity: .6;
	cursor: default;
}

.tbs-newsletter__notice {
	margin: 8px 0 0;
	font-size: 12px;
	color: #8fd19e;
}

.tbs-newsletter__notice.is-error {
	color: #f3a3a3;
}

.tbs-site-footer h2,
.tbs-site-footer h3 {
	color: #fff;
	margin: 0 0 var(--tbs-space-4);
}

.tbs-site-footer h2 {
	font-size: var(--tbs-text-xl);
	font-weight: 700;
	letter-spacing: -.022em;
}

.tbs-site-footer h3 {
	font-size: var(--tbs-text-base);
	font-weight: 600;
	letter-spacing: -.005em;
}

.tbs-site-footer p {
	margin: 0 0 16px;
	max-width: 42ch;
	font-size: 13px;
	color: #9fb0c8;
}

.tbs-site-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 7px;
	font-size: 13px;
}

.tbs-site-footer a {
	color: #cbd5e4;
	text-decoration: none;
}

.tbs-site-footer a:hover {
	color: #fff;
	text-decoration: underline;
}

.tbs-pay-methods {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tbs-pay-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 24px;
	padding: 0 7px;
	border-radius: 4px;
	background: #fff;
	color: #0f1c33;
	font-size: 8.5px;
	font-weight: 800;
	letter-spacing: .01em;
	white-space: nowrap;
}

.tbs-pay-badge--paypal { color: #003087; }
.tbs-pay-badge--visa   { color: #1a1f71; font-style: italic; }
.tbs-pay-badge--mc     { color: #eb001b; }
.tbs-pay-badge--jcb    { color: #0e4c96; }
.tbs-pay-badge--amex   { background: #006fcf; color: #fff; font-size: 7.5px; }

.tbs-site-footer__bottom {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	max-width: var(--tbs-container);
	margin: 30px auto 0;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, .12);
	color: #8598b4;
	font-size: 12px;
}

/* Privacy / Terms / Refund, inline after the copyright line rather than a
   fourth footer column — three links don't earn their own grid track, and
   this is where visitors expect to find them regardless. */
.tbs-site-footer__legal {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px 12px;
	margin-left: 12px;
	padding-left: 12px;
	border-left: 1px solid rgba(255, 255, 255, .18);
}

.tbs-site-footer__legal a {
	white-space: nowrap;
}

/* ------------------------------------------------------ available options */

.tbs-options-target:empty {
	display: none;
}

.tbs-options {
	margin: 34px 0;
}

.tbs-options__note {
	padding: 13px 16px;
	margin: 0 0 16px;
	background: var(--tbs-soft);
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius-sm);
	font-size: 13px;
	color: var(--tbs-muted);
}

.tbs-option {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 236px;
	gap: var(--tbs-space-6);
	padding: var(--tbs-space-6);
	margin-bottom: var(--tbs-space-4);
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
	box-shadow: var(--tbs-shadow-xs);
	transition: border-color .18s ease, box-shadow .18s ease;
}

.tbs-option:hover {
	border-color: var(--tbs-primary);
	box-shadow: var(--tbs-shadow);
}

.tbs-option__title {
	margin: 0 0 var(--tbs-space-4);
	font-size: var(--tbs-text-lg);
	font-weight: 700;
	letter-spacing: -.018em;
	color: var(--tbs-navy);
}

.tbs-option__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 6px 18px;
	list-style: none;
	margin: 0 0 12px;
	padding: 0;
	font-size: 13px;
}

.tbs-option__facts li {
	display: flex;
	align-items: baseline;
	gap: 6px;
	color: var(--tbs-muted);
}

.tbs-option__facts strong {
	color: var(--tbs-ink);
}

.tbs-option__policies {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 6px 18px;
	list-style: none;
	margin: 0 0 12px;
	padding: 0;
	font-size: 13px;
	color: var(--tbs-muted);
}

.tbs-option__policies li {
	display: flex;
	align-items: flex-start;
	gap: 7px;
}

.tbs-option__policies .tbs-icon {
	margin-top: 2px;
	color: var(--tbs-green);
}

.tbs-option__desc {
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 1.65;
	color: #35405a;
}

.tbs-option__meeting {
	display: flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	font-size: 13px;
	color: var(--tbs-primary);
	font-weight: 600;
}

.tbs-option__seats {
	margin: 7px 0 0;
	font-size: 12px;
	color: var(--tbs-red);
	font-weight: 600;
}

.tbs-option__side {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: space-between;
	gap: 14px;
	padding-left: 20px;
	border-left: 1px solid var(--tbs-line);
	text-align: right;
}

.tbs-option__price strong {
	display: block;
	font-size: 1.625rem;
	font-weight: 700;
	letter-spacing: -.03em;
	line-height: 1.15;
}

.tbs-option__price span {
	display: block;
	color: var(--tbs-muted);
	font-size: 12px;
}

.tbs-option__cars {
	color: var(--tbs-primary) !important;
	font-weight: 600;
}

.tbs-option__continue {
	width: 100%;
	border-radius: var(--tbs-radius-sm);
}

/* ------------------------------------------------------- booking widget v2 */

.tbs-booking__assurance {
	list-style: none;
	margin: 14px 0 0;
	padding: 14px 0 0;
	border-top: 1px solid var(--tbs-line);
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tbs-booking__assurance li {
	display: flex;
	gap: 9px;
	align-items: flex-start;
}

.tbs-booking__assurance .tbs-icon {
	margin-top: 2px;
	color: var(--tbs-green);
}

.tbs-booking__assurance strong {
	display: block;
	font-size: 13px;
}

.tbs-booking__assurance span {
	color: var(--tbs-muted);
	font-size: 12px;
	line-height: 1.5;
}

/* ------------------------------------------------------ cart v2 additions */

.tbs-cart-item__specs {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 4px 12px;
	margin: 0 0 11px;
	font-size: 13px;
}

.tbs-cart-item__specs dt {
	color: var(--tbs-muted);
	font-weight: 600;
}

.tbs-cart-item__specs dd {
	margin: 0;
}

.tbs-extras,
.tbs-coupon-box {
	padding: 18px;
	background: #fff;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius);
}

.tbs-extras h2,
.tbs-coupon-box h2 {
	margin: 0 0 12px;
	font-size: 17px;
}

.tbs-extra {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius-sm);
	font-size: 14px;
	cursor: pointer;
	margin-bottom: 8px;
}

.tbs-extra:hover {
	border-color: var(--tbs-primary);
}

.tbs-extra__name {
	flex: 1;
	font-weight: 600;
}

.tbs-extra__price {
	color: var(--tbs-muted);
	font-size: 13px;
	white-space: nowrap;
}

.tbs-coupon-input {
	display: flex;
	gap: 9px;
	flex-wrap: wrap;
}

.tbs-coupon-input input {
	flex: 1;
	min-width: 180px;
	padding: 11px 13px;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius-sm);
	font-size: 14px;
}

.tbs-coupon-applied {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 12px 14px;
	background: var(--tbs-green-soft);
	border: 1px solid #bfe6d0;
	border-radius: var(--tbs-radius-sm);
	font-size: 14px;
}

.tbs-summary-lines__note {
	justify-content: flex-start !important;
	color: var(--tbs-muted);
	font-size: 12px;
	margin-top: -6px;
}

.tbs-discount {
	color: var(--tbs-green);
}

.tbs-summary-total--minor {
	padding: 7px 0;
	border-top: 0;
	font-weight: 600;
	font-size: 14px;
}

.tbs-summary-total--minor strong {
	font-size: 15px;
}

.tbs-summary-total--due strong {
	color: var(--tbs-red);
}

/* ---------------------------------------------------- checkout v2 & payment */

.tbs-plans {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.tbs-plan {
	display: flex;
	align-items: flex-start;
	gap: var(--tbs-space-3);
	padding: var(--tbs-space-4) var(--tbs-space-5);
	border: 1px solid var(--tbs-line-strong);
	border-radius: var(--tbs-radius-sm);
	cursor: pointer;
	transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.tbs-plan:hover {
	border-color: var(--tbs-primary);
}

.tbs-plan input[type="radio"] {
	margin-top: 3px;
	accent-color: var(--tbs-primary);
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
}

.tbs-plan.is-selected {
	border-color: var(--tbs-primary);
	background: var(--tbs-primary-soft);
	box-shadow: var(--tbs-ring);
}

.tbs-plan__body strong {
	display: block;
	font-size: 14px;
	margin-bottom: 3px;
}

.tbs-plan__body span {
	color: var(--tbs-muted);
	font-size: 13px;
	line-height: 1.55;
}

.tbs-req {
	color: var(--tbs-red);
}

.tbs-optional {
	color: var(--tbs-muted);
	font-weight: 400;
}

.tbs-field-help {
	margin: -6px 0 14px;
	color: var(--tbs-muted);
	font-size: 12px;
	line-height: 1.6;
}

.tbs-terms-box {
	padding: 16px;
	border: 1px solid var(--tbs-line);
	border-radius: var(--tbs-radius-sm);
}

.tbs-terms-box .tbs-terms {
	margin-top: 0;
	font-size: 13px;
	color: #35405a;
}

.tbs-order-detail {
	padding-bottom: 14px;
	margin-bottom: 14px;
	border-bottom: 1px solid var(--tbs-line);
}

.tbs-order-detail h3 {
	margin: 0 0 9px;
	font-size: 15px;
}

.tbs-payment-summary h2 {
	margin: 0 0 10px;
	font-size: 18px;
}

.tbs-summary-lines--payment {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--tbs-line);
	font-size: 14px;
	gap: 9px;
}

.tbs-summary-lines--payment li {
	display: flex;
	justify-content: space-between;
	gap: 14px;
}

.tbs-summary-lines--payment li:last-child {
	padding-top: 9px;
	border-top: 1px dashed var(--tbs-line);
}

.tbs-payment-methods {
	margin-top: 18px;
}

.tbs-payment-methods h2 {
	margin: 0 0 14px;
	font-size: 17px;
}

.tbs-payment-methods .tbs-btn--block {
	margin-top: 16px;
}

.tbs-payment-history {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-size: 13px;
}

.tbs-payment-history li {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--tbs-line);
}

.tbs-payment-page .tbs-card-plain + .tbs-card-plain {
	margin-top: 18px;
}

/* ---------------------------------------------------------------- toasts */

.tbs-toast-stack {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 99999;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.tbs-toast {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	border-radius: var(--tbs-radius-sm);
	background: var(--tbs-navy);
	color: #fff;
	font-size: 13px;
	box-shadow: 0 8px 26px rgba(16, 24, 40, .22);
	animation: tbs-toast-in .2s ease;
	max-width: 330px;
}

.tbs-toast--error { background: #97231f; }
.tbs-toast--ok    { background: #0d7a45; }

.tbs-toast a {
	color: #fff;
	text-decoration: underline;
	white-space: nowrap;
}

@keyframes tbs-toast-in {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: none; }
}

.tbs-is-loading {
	opacity: .55;
	pointer-events: none;
}


/* --------------------------------------------- mobile-only affordances */

.tbs-booking-bar {
	display: none;
}

.tbs-filters-toggle {
	display: none;
	align-items: center;
	gap: var(--tbs-space-2);
	width: 100%;
	min-height: 46px;
	padding: 0 var(--tbs-space-4);
	border: 1px solid var(--tbs-line-strong);
	border-radius: var(--tbs-radius-sm);
	background: #fff;
	color: var(--tbs-ink);
	font-family: inherit;
	font-size: var(--tbs-text-base);
	font-weight: 600;
	cursor: pointer;
}

.tbs-filters-toggle span {
	flex: 1;
	text-align: left;
}

/* background-color is already reclaimed for every state by the systematic
   reset near the top of this file; only the label's own colour was left
   for Astra's button:hover/:focus/:active to turn white. */
.tbs-filters-toggle:hover,
.tbs-filters-toggle:focus,
.tbs-filters-toggle:focus-visible,
.tbs-filters-toggle:active {
	color: var(--tbs-ink);
}

.tbs-filters-toggle .tbs-icon--chevron {
	transition: transform .18s ease;
}

/* ----------------------------------------------------------- breakpoints */

@media (max-width: 1120px) {
	.tbs-single__layout {
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: var(--tbs-space-6);
	}

	.tbs-archive__layout {
		grid-template-columns: 220px minmax(0, 1fr);
		gap: var(--tbs-space-6);
	}
}

@media (max-width: 1024px) {
	.tbs-hero__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--tbs-space-8);
	}

	.tbs-hero__media {
		height: 340px;
	}

	.tbs-site-footer__inner {
		grid-template-columns: 1fr 1fr;
		gap: var(--tbs-space-8);
	}

	.tbs-site-footer__brand,
	.tbs-site-footer__touch {
		grid-column: 1 / -1;
	}

	.tbs-single__layout,
	.tbs-cart-layout,
	.tbs-checkout-layout,
	.tbs-archive__layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.tbs-booking,
	.tbs-cart-summary,
	.tbs-checkout-summary,
	.tbs-filters {
		position: static;
	}

	/* The sidebar reads better above the long-form content on tablets. */
	.tbs-single__aside {
		order: -1;
	}

	.tbs-grid-cards--4,
	.tbs-grid-cards--5 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 1120px) {
	.tbs-results--grid-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tbs-card--list .tbs-card__body {
		grid-template-columns: minmax(0, 1fr) 160px;
		gap: var(--tbs-space-2) var(--tbs-space-4);
	}

	.tbs-card--list .tbs-card__footer {
		padding-left: var(--tbs-space-4);
	}
}

@media (max-width: 880px) {
	.tbs-grid-cards--3,
	.tbs-grid-cards--4,
	.tbs-grid-cards--5 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Stack the list card's price back under the text before it gets cramped. */
	.tbs-card--list .tbs-card__body {
		grid-template-columns: minmax(0, 1fr);
	}

	.tbs-card--list .tbs-card__footer {
		grid-column: 1;
		grid-row: auto;
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		padding: var(--tbs-space-3) 0 0;
		border-left: 0;
		border-top: 1px solid var(--tbs-line);
		text-align: left;
	}

	.tbs-option {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--tbs-space-4);
	}

	.tbs-option__side {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding-left: 0;
		padding-top: var(--tbs-space-4);
		border-left: 0;
		border-top: 1px solid var(--tbs-line);
		text-align: left;
	}

	.tbs-option__continue {
		width: auto;
		min-width: 150px;
	}
}

@media (max-width: 782px) {
	:root {
		--tbs-gutter: 16px;
	}

	.tbs-wrap {
		padding-top: var(--tbs-space-5);
		padding-bottom: var(--tbs-space-10);
	}

	.tbs-hero {
		padding: var(--tbs-space-8) var(--tbs-gutter);
	}

	.tbs-hero__media {
		height: 260px;
		gap: var(--tbs-space-3);
	}

	.tbs-hero__tile--lead {
		height: 100%;
	}

	.tbs-hero .tbs-searchbar {
		max-width: none;
	}

	.tbs-tours-block,
	.tbs-inspiration,
	.tbs-reviews-block,
	.tbs-categories-block {
		padding: var(--tbs-space-10) var(--tbs-gutter);
	}

	.tbs-section {
		margin: var(--tbs-space-10) 0;
	}

	.tbs-site-footer__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--tbs-space-6);
	}

	.tbs-gallery,
	.tbs-info-grid,
	.tbs-inex,
	.tbs-form-grid,
	.tbs-confirmation__grid,
	.tbs-account-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	/*
	 * Stacked layout: the thumbnails become one strip of four under the hero,
	 * so there is no column height left to match. The 4/3 tiles come back and
	 * the single row is sized by them again.
	 */
	.tbs-gallery__thumbs {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		grid-template-rows: auto;
	}

	.tbs-gallery__thumb {
		height: auto;
		aspect-ratio: 4 / 3;
	}

	.tbs-gallery__main {
		aspect-ratio: 16 / 10;
		max-height: 300px;
	}

	.tbs-gallery__main img {
		max-height: 300px;
	}

	.tbs-results--grid-2,
	.tbs-results--grid-3 {
		grid-template-columns: minmax(0, 1fr);
	}

	.tbs-card--list {
		flex-direction: column;
	}

	.tbs-card--list .tbs-card__media {
		flex: none;
		aspect-ratio: 16 / 10;
	}

	.tbs-card--list .tbs-card__title {
		font-size: var(--tbs-text-lg);
	}

	.tbs-cart-item {
		grid-template-columns: 96px minmax(0, 1fr);
		gap: var(--tbs-space-4);
		padding: var(--tbs-space-4);
	}

	.tbs-cart-item__media img {
		height: 96px;
	}

	.tbs-cart-item__side {
		grid-column: 1 / -1;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding-top: var(--tbs-space-3);
		border-top: 1px solid var(--tbs-line);
	}

	.tbs-review-summary {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--tbs-space-5);
	}

	.tbs-itinerary li {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--tbs-space-1);
	}

	.tbs-checkout-section,
	.tbs-cart-summary,
	.tbs-checkout-summary,
	.tbs-card-plain,
	.tbs-extras,
	.tbs-coupon-box {
		padding: var(--tbs-space-5);
	}

	.tbs-archive__bar {
		gap: var(--tbs-space-3);
	}

	.tbs-sort select {
		min-height: 44px;
	}

	/* Sidebar filters fold behind a toggle rather than disappearing. */
	.tbs-filters-toggle {
		display: flex;
	}

	.tbs-filters {
		display: none;
		margin-bottom: var(--tbs-space-4);
	}

	.tbs-filters.is-open {
		display: flex;
	}

	.tbs-filters-toggle[aria-expanded="true"] .tbs-icon--chevron {
		transform: rotate(90deg);
	}

	/*
	 * Sticky action bar. It only appears once the widget itself has scrolled
	 * out of view, so it never competes with the real booking form.
	 */
	.tbs-single-tour .tbs-booking-bar {
		display: flex;
		position: fixed;
		inset: auto 0 0 0;
		z-index: 900;
		align-items: center;
		justify-content: space-between;
		gap: var(--tbs-space-4);
		padding: var(--tbs-space-3) var(--tbs-gutter);
		padding-bottom: calc(var(--tbs-space-3) + env(safe-area-inset-bottom, 0px));
		background: rgba(255, 255, 255, .97);
		backdrop-filter: blur(8px);
		border-top: 1px solid var(--tbs-line);
		box-shadow: 0 -4px 20px rgba(16, 24, 40, .1);
	}

	.tbs-booking-bar__price {
		display: flex;
		flex-direction: column;
		line-height: 1.2;
	}

	.tbs-booking-bar__price span {
		color: var(--tbs-muted);
		font-size: var(--tbs-text-xs);
	}

	.tbs-booking-bar__price strong {
		font-size: var(--tbs-text-xl);
		font-weight: 700;
		letter-spacing: -.02em;
	}

	.tbs-booking-bar .tbs-btn {
		flex: 0 0 auto;
	}

	/* Room for the bar so it never covers the last element. */
	.tbs-single-tour .tbs-wrap {
		padding-bottom: 96px;
	}
}

@media (max-width: 560px) {
	.tbs-grid-cards--2,
	.tbs-grid-cards--3,
	.tbs-grid-cards--4,
	.tbs-grid-cards--5 {
		grid-template-columns: minmax(0, 1fr);
	}

	.tbs-hero__media {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		height: 220px;
	}

	.tbs-hero__tile--lead {
		grid-row: span 2;
	}

	.tbs-single__headline {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--tbs-space-3);
	}

	.tbs-cart-item {
		grid-template-columns: minmax(0, 1fr);
	}

	.tbs-cart-item__media img {
		height: 160px;
	}

	.tbs-cart-item__qty {
		flex-wrap: wrap;
	}

	.tbs-cart-item__qty input {
		width: 100%;
		min-height: 44px;
	}

	.tbs-cart-actions {
		flex-direction: column;
		align-items: stretch;
		gap: var(--tbs-space-3);
	}

	.tbs-cart-actions .tbs-btn {
		width: 100%;
	}

	.tbs-coupon-input {
		flex-direction: column;
	}

	.tbs-coupon-input input,
	.tbs-coupon-input .tbs-btn {
		width: 100%;
		min-height: 44px;
	}

	.tbs-option__side {
		flex-direction: column;
		align-items: stretch;
		text-align: left;
	}

	.tbs-option__continue {
		width: 100%;
	}

	.tbs-reviews-block__cta {
		flex-direction: column;
	}

	.tbs-reviews-block__cta .tbs-btn {
		width: 100%;
	}

	.tbs-scroller > * {
		flex-basis: 86%;
	}

	.tbs-review--compact {
		flex-basis: 86%;
	}

	.tbs-account-booking__foot {
		flex-wrap: wrap;
	}

	.tbs-deflist {
		grid-template-columns: minmax(0, 1fr);
		gap: 2px;
	}

	.tbs-deflist dd {
		margin-bottom: var(--tbs-space-3);
	}
}

@media (prefers-reduced-motion: reduce) {
	.tbs-card,
	.tbs-card__media img,
	.tbs-post-card,
	.tbs-btn,
	.tbs-wish {
		transition: none;
	}

	.tbs-card:hover,
	.tbs-post-card:hover {
		transform: none;
	}

	.tbs-card:hover .tbs-card__media img {
		transform: none;
	}
}

/* ------------------------------------------------------ currency switcher */

.tbs-currency {
	display: inline-flex;
	align-items: center;
	padding: 3px;
	border: 1px solid var(--tbs-line-strong, #d5dce6);
	border-radius: 999px;
	background: #fff;
	line-height: 1;
}

/* Astra styles every <button>; height, padding and colour are set outright so
   the pill does not inherit the theme's block-shaped defaults. */
.tbs-currency .tbs-currency__btn,
.tbs-currency .tbs-currency__btn:hover,
.tbs-currency .tbs-currency__btn:focus,
.tbs-currency .tbs-currency__btn:active {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 52px;
	height: 30px;
	margin: 0;
	padding: 0 14px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--tbs-muted, #6b7789);
	font-family: inherit;
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
	transition: background .18s ease, color .18s ease;
}

.tbs-currency .tbs-currency__btn:hover {
	color: var(--tbs-ink, #0f1c33);
}

.tbs-currency .tbs-currency__btn.is-active,
.tbs-currency .tbs-currency__btn.is-active:hover,
.tbs-currency .tbs-currency__btn.is-active:focus {
	background: var(--tbs-primary, #1a56db);
	color: #fff;
}

.tbs-currency .tbs-currency__btn:focus-visible {
	outline: 2px solid var(--tbs-primary, #1a56db);
	outline-offset: 2px;
}

/* Amounts are restated in place on switch; reserving no width keeps the card
   layout from jumping, but the tabular figures stop digits from dancing. */
.tbs-amount {
	font-variant-numeric: tabular-nums;
}

.tbs-currency-note {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0 0 var(--tbs-space-4, 1rem);
	padding: 10px 14px;
	border: 1px solid #cbdcfa;
	border-radius: var(--tbs-radius-sm, 10px);
	background: #eef4fe;
	color: var(--tbs-ink, #0f1c33);
	font-size: .875rem;
	line-height: 1.5;
}

/* --------------------------------------------------------------- lightbox */

.tbs-no-scroll {
	overflow: hidden;
}

.tbs-gallery__main img {
	cursor: zoom-in;
}

.tbs-gallery__thumb.is-current {
	outline: 3px solid var(--tbs-primary);
	outline-offset: -3px;
}

.tbs-gallery__thumb--all .tbs-gallery__more {
	font-size: 14px;
	letter-spacing: .01em;
}

.tbs-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(12px, 4vw, 48px);
}

/* [hidden] alone loses to the display:flex above, so it is restated. */
.tbs-lightbox[hidden] {
	display: none;
}

.tbs-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(9, 14, 26, .88);
}

.tbs-lightbox__dialog {
	position: relative;
	display: flex;
	align-items: center;
	gap: clamp(8px, 2vw, 20px);
	width: min(1100px, 100%);
	max-height: 100%;
}

.tbs-lightbox__figure {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	text-align: center;
}

.tbs-lightbox__figure img {
	display: block;
	width: 100%;
	max-height: min(74vh, 720px);
	object-fit: contain;
	border-radius: var(--tbs-radius);
	background: #0b1220;
}

.tbs-lightbox__caption {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 12px;
	color: rgba(255, 255, 255, .82);
	font-size: 13px;
	line-height: 1.5;
}

.tbs-lightbox__counter {
	flex: 0 0 auto;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .14);
	font-variant-numeric: tabular-nums;
	font-weight: 600;
}

/* Astra paints every button; each state is claimed so the controls stay
   translucent circles instead of turning into solid blue blocks on hover. */
.tbs-lightbox .tbs-lightbox__nav,
.tbs-lightbox .tbs-lightbox__nav:hover,
.tbs-lightbox .tbs-lightbox__nav:focus,
.tbs-lightbox .tbs-lightbox__nav:focus-visible,
.tbs-lightbox .tbs-lightbox__nav:active,
.tbs-lightbox .tbs-lightbox__close,
.tbs-lightbox .tbs-lightbox__close:hover,
.tbs-lightbox .tbs-lightbox__close:focus,
.tbs-lightbox .tbs-lightbox__close:focus-visible,
.tbs-lightbox .tbs-lightbox__close:active {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	min-height: 0;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 999px;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
	transition: background .18s ease;
}

.tbs-lightbox .tbs-lightbox__nav:hover,
.tbs-lightbox .tbs-lightbox__nav:focus-visible,
.tbs-lightbox .tbs-lightbox__close:hover,
.tbs-lightbox .tbs-lightbox__close:focus-visible {
	background: rgba(255, 255, 255, .26);
	color: #fff;
}

.tbs-lightbox .tbs-lightbox__close {
	position: absolute;
	top: -10px;
	right: -6px;
	z-index: 2;
}

@media (max-width: 640px) {
	.tbs-lightbox__dialog {
		flex-wrap: wrap;
		justify-content: center;
	}

	.tbs-lightbox__figure {
		order: -1;
		flex-basis: 100%;
	}

	.tbs-lightbox .tbs-lightbox__close {
		top: -4px;
		right: 0;
	}
}
