.tal-box {
	--tal-bg: #f6f8fa;
	--tal-border: #dde3ea;
	--tal-accent: #0a66c2;
	--tal-text: #1d2733;
	--tal-muted: #5b6876;
	margin: 1.75em 0;
	padding: 1.1em 1.25em;
	background: var(--tal-bg);
	border: 1px solid var(--tal-border);
	border-left: 4px solid var(--tal-accent);
	border-radius: 8px;
	color: var(--tal-text);
}
.tal-box .tal-heading {
	margin: 0 0 .7em;
	font-weight: 700;
	font-size: 1.05em;
}
.tal-box .tal-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .5em;
}
.tal-box .tal-links li { margin: 0; padding: 0; }
.tal-box .tal-link {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1em;
	padding: .65em .9em;
	background: #fff;
	border: 1px solid var(--tal-border);
	border-radius: 6px;
	text-decoration: none;
	color: var(--tal-text);
	transition: border-color .15s, box-shadow .15s;
}
.tal-box .tal-link:hover,
.tal-box .tal-link:focus-visible {
	border-color: var(--tal-accent);
	box-shadow: 0 1px 4px rgba(10, 102, 194, .15);
}
.tal-box .tal-label { font-weight: 600; }
.tal-box .tal-label::after { content: " \2192"; color: var(--tal-accent); }
.tal-box .tal-provider {
	font-size: .8em;
	color: var(--tal-muted);
	white-space: nowrap;
}
.tal-box .tal-disclosure {
	margin: .8em 0 0;
	font-size: .78em;
	color: var(--tal-muted);
}
@media (prefers-color-scheme: dark) {
	.tal-box {
		--tal-bg: #1b222b;
		--tal-border: #2e3946;
		--tal-accent: #4ea1ff;
		--tal-text: #e6edf3;
		--tal-muted: #9aa7b4;
	}
	.tal-box .tal-link { background: #121820; }
}

/* ---------- Trip planner bar ---------- */
.tal-bar {
	--tal-bar-bg: #181818;
	--tal-bar-pill: #ffffff;
	--tal-bar-accent: #cc00cc;
	margin: 2em 0 0;
	background: var(--tal-bar-bg);
}
.tal-bar .tal-bar__list {
	list-style: none;
	margin: 0 auto;
	padding: 12px 16px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	box-sizing: border-box;
}
.tal-bar .tal-bar__step { margin: 0; padding: 0; flex: none; }
.tal-bar .tal-bar__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 22px 10px 14px;
	border-radius: 999px;
	background: var(--tal-bar-pill);
	color: var(--tal-bar-accent);
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 700;
	font-size: 26px;
	line-height: 1.2;
	white-space: nowrap;
	text-decoration: none;
	transition: background-color .15s, color .15s, box-shadow .15s;
}
.tal-bar .tal-bar__num {
	display: inline-grid;
	place-items: center;
	width: 1.4em;
	height: 1.4em;
	border-radius: 50%;
	font-size: .78em;
	background: var(--tal-bar-accent);
	color: var(--tal-bar-pill);
}
/* Highlighted button (e.g. Best Hotels) */
.tal-bar .tal-bar__step--cta .tal-bar__link { padding: 10px 24px; }
/* Current step: colours reversed */
.tal-bar .tal-bar__step--active .tal-bar__link {
	background: var(--tal-bar-accent);
	color: var(--tal-bar-pill);
}
.tal-bar .tal-bar__step--active .tal-bar__num {
	background: var(--tal-bar-pill);
	color: var(--tal-bar-accent);
}
/* Hover */
.tal-bar a.tal-bar__link:hover,
.tal-bar a.tal-bar__link:focus-visible {
	color: var(--tal-bar-accent);
	box-shadow: 0 0 0 3px rgba(204, 0, 204, .45);
}
.tal-bar .tal-bar__step--active a.tal-bar__link:hover,
.tal-bar .tal-bar__step--active a.tal-bar__link:focus-visible { color: var(--tal-bar-pill); }
.tal-bar a.tal-bar__link:focus-visible { outline: 2px solid var(--tal-bar-pill); outline-offset: 3px; }

/* Light version: [trip_planner_bar style="light"] */
.tal-bar.tal-bar--light {
	--tal-bar-bg: #f0f1f0;
	border-top: 1px solid #4a4a4a;
	border-bottom: 1px solid #4a4a4a;
}
.tal-bar.tal-bar--light a.tal-bar__link:focus-visible { outline-color: var(--tal-bar-accent); }

@media (max-width: 900px) {
	.tal-bar .tal-bar__link { font-size: 18px; padding: 8px 16px 8px 10px; gap: 8px; }
	.tal-bar .tal-bar__step--cta .tal-bar__link { padding: 8px 18px; }
}
@media (max-width: 600px) {
	.tal-bar .tal-bar__list { gap: 6px; padding: 10px 12px; }
	.tal-bar .tal-bar__link { font-size: 16px; padding: 6px 12px 6px 8px; gap: 6px; }
	.tal-bar .tal-bar__step--cta .tal-bar__link { padding: 6px 16px; }
}
