/* Salient Toolkit – Pill Tabs */
.stk-pt {
	--stk-pt-top: 30px;
	--stk-pt-auto-text: #fff;
	--stk-pt-tint: rgba(128, 128, 128, .12);
	--stk-pt-tint-hover: rgba(128, 128, 128, .2);
	--stk-pt-gap: 10px;
	--stk-pt-py: 10px;
	--stk-pt-px: 18px;
	--stk-pt-fs: 16px;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
	width: 100%;
}
.light .stk-pt { --stk-pt-auto-text: #000; }
@supports (color: color-mix(in srgb, red 50%, transparent)) {
	.stk-pt {
		--stk-pt-tint: color-mix(in srgb, currentColor 9%, transparent);
		--stk-pt-tint-hover: color-mix(in srgb, currentColor 16%, transparent);
	}
	.stk-pt[style*="--stk-pt-tab-bg"] { --stk-pt-tint-hover: color-mix(in srgb, var(--stk-pt-tab-bg) 85%, currentColor); }
}
.stk-pt[data-size="small"] { --stk-pt-py: 7px; --stk-pt-px: 14px; --stk-pt-fs: 14px; --stk-pt-gap: 8px; }
.stk-pt[data-size="large"] { --stk-pt-py: 13px; --stk-pt-px: 24px; --stk-pt-fs: 18px; --stk-pt-gap: 12px; }
.stk-pt--split { grid-template-columns: var(--stk-pt-nav, 45%) minmax(0, 1fr); gap: 60px; align-items: start; }
.stk-pt--split[data-sticky="true"] > .stk-pt-nav-wrap { position: sticky; top: var(--stk-pt-top); }

.stk-pt-nav { display: flex; flex-wrap: wrap; gap: var(--stk-pt-gap); margin: 0; padding: 0; }
.stk-pt--stacked[data-align="center"] .stk-pt-nav { justify-content: center; }
.stk-pt--stacked[data-align="right"] .stk-pt-nav { justify-content: flex-end; }

.stk-pt .stk-pt-tab {
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	margin: 0;
	padding: var(--stk-pt-py) var(--stk-pt-px);
	border: 0;
	border-radius: 999px;
	box-shadow: none;
	background: var(--stk-pt-tab-bg, var(--stk-pt-tint));
	color: var(--stk-pt-tab-text, inherit);
	font: inherit;
	font-size: var(--stk-pt-fs);
	line-height: 1.25;
	letter-spacing: normal;
	text-transform: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
	-webkit-tap-highlight-color: transparent;
}
.stk-pt .stk-pt-tab:hover { background: var(--stk-pt-tint-hover); }
.stk-pt .stk-pt-tab[aria-selected="true"],
.stk-pt .stk-pt-tab[aria-selected="true"]:hover { background: var(--stk-pt-active-bg, currentColor); cursor: default; }
.stk-pt .stk-pt-tab[aria-selected="true"] .stk-pt-label { color: var(--stk-pt-active-text, var(--stk-pt-auto-text)); }
.stk-pt .stk-pt-tab:focus { outline: none; }
.stk-pt .stk-pt-tab:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

.stk-pt-panels { min-width: 0; }
.stk-pt-panel[hidden], .vc_editor .stk-pt-panels > .vc_element[hidden] { display: none !important; }
.stk-pt-panel { scroll-margin-top: 120px; }
.stk-pt-panel:focus { outline: none; }
.stk-pt-panel:focus-visible { outline: 2px dashed currentColor; outline-offset: 6px; }
.stk-pt-inner > :last-child { margin-bottom: 0; }
.stk-pt-inner > .toggles:first-child, .stk-pt-inner > .vc_element:first-child > .toggles { margin-top: 0; }
.stk-pt-panel.is-entering { animation: stk-pt-in .35s ease both; }
@keyframes stk-pt-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* Tabs above the content on tablets (when chosen) and always on phones. */
@media only screen and (max-width: 999px) {
	.stk-pt--split[data-stack="tablet"] { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.stk-pt--split[data-stack="tablet"] > .stk-pt-nav-wrap { position: static; }
}
@media only screen and (max-width: 690px) {
	.stk-pt { --stk-pt-fs: 15px; }
	.stk-pt--split { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.stk-pt--split > .stk-pt-nav-wrap { position: static; }
}

/* One line, swipe sideways: on tablets where the tabs sit above, and on phones. */
@media only screen and (max-width: 999px) {
	.stk-pt[data-swipe="tablet"] > .stk-pt-nav-wrap { min-width: 0; max-width: 100%; overflow: hidden; }
	.stk-pt[data-swipe="tablet"] .stk-pt-nav { flex-wrap: nowrap !important; justify-content: flex-start; overflow-x: auto; overflow-y: hidden; padding: 3px; scrollbar-width: none; overscroll-behavior-x: contain; scroll-snap-type: x proximity; }
	.stk-pt[data-swipe="tablet"] .stk-pt-nav::-webkit-scrollbar { display: none; }
	.stk-pt[data-swipe="tablet"] .stk-pt-tab { scroll-snap-align: start; }
	.stk-pt[data-swipe="tablet"][data-align="center"] .stk-pt-tab:first-child,
	.stk-pt[data-swipe="tablet"][data-align="right"] .stk-pt-tab:first-child { margin-left: auto; }
	.stk-pt[data-swipe="tablet"][data-align="center"] .stk-pt-tab:last-child { margin-right: auto; }
}
@media only screen and (max-width: 690px) {
	.stk-pt[data-swipe="phone"] > .stk-pt-nav-wrap { min-width: 0; max-width: 100%; overflow: hidden; }
	.stk-pt[data-swipe="phone"] .stk-pt-nav { flex-wrap: nowrap !important; justify-content: flex-start; overflow-x: auto; overflow-y: hidden; padding: 3px; scrollbar-width: none; overscroll-behavior-x: contain; scroll-snap-type: x proximity; }
	.stk-pt[data-swipe="phone"] .stk-pt-nav::-webkit-scrollbar { display: none; }
	.stk-pt[data-swipe="phone"] .stk-pt-tab { scroll-snap-align: start; }
}

/* Soft fade on the edge that has more pills behind it (set by the script). */
.stk-pt-nav-wrap.has-more-right { -webkit-mask-image: linear-gradient(to right, #000 82%, transparent); mask-image: linear-gradient(to right, #000 82%, transparent); }
.stk-pt-nav-wrap.has-more-left { -webkit-mask-image: linear-gradient(to left, #000 82%, transparent); mask-image: linear-gradient(to left, #000 82%, transparent); }
.stk-pt-nav-wrap.has-more-left.has-more-right { -webkit-mask-image: linear-gradient(to right, transparent, #000 14%, #000 86%, transparent); mask-image: linear-gradient(to right, transparent, #000 14%, #000 86%, transparent); }

@media (prefers-reduced-motion: reduce) {
	.stk-pt .stk-pt-tab { transition: none; }
	.stk-pt .stk-pt-panel.is-entering { animation: none; }
}