/**
 * Legal sections + sticky TOC ([vh_terms_sections]).
 * Brand: Elementor Global Color vars with DESIGN.md hex fallbacks.
 * Typography (Instrument Serif headings / Pathway Extreme body) inherits
 * from the kit — nothing re-declared here.
 */

/* smooth anchor scrolling, only while this stylesheet is loaded */
html {
	scroll-behavior: smooth;
}

/* The theme's body{overflow-x:hidden} makes body a scroll container, which
 * kills position:sticky for the TOC. clip gives the same horizontal
 * clipping without creating a scroll container. Scoped to legal pages —
 * this stylesheet only loads where [vh_terms_sections] is used. */
body {
	overflow-x: clip !important;
	overflow-y: visible !important;
}
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

.vh-tcs {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
	max-width: 1140px;
	margin: 0 auto;
	padding: 24px 20px 64px;
}

/* anchor targets clear the sticky site header */
.vh-tcs-section {
	scroll-margin-top: 170px;
}

/* ---- table of contents ---- */
.vh-tcs-toc {
	align-self: start;
	position: sticky;
	top: 120px;
	z-index: 10;
}
.vh-tcs-toc-details {
	background: var(--e-global-color-secondary, #C6AEFF);
	background: color-mix(in srgb, var(--e-global-color-secondary, #C6AEFF) 18%, #FFFFFF);
	border: 1px solid var(--e-global-color-secondary, #C6AEFF);
	border-radius: 12px;
	padding: 16px 20px;
}
.vh-tcs-toc-heading {
	cursor: pointer;
	font-weight: 700;
	font-size: 1rem;
	color: var(--e-global-color-primary, #45234C);
	list-style-position: inside;
}
.vh-tcs-toc-heading:focus-visible {
	outline: 2px solid var(--e-global-color-primary, #45234C);
	outline-offset: 2px;
}
.vh-tcs-toc-list {
	margin: 12px 0 0;
	padding: 0 0 0 4px;
	list-style: none;
	counter-reset: vh-toc;
	max-height: calc(100vh - 280px);
	overflow-y: auto;
}
.vh-tcs-toc-list li {
	counter-increment: vh-toc;
	margin: 0 0 2px;
}
.vh-tcs-toc-list a {
	display: block;
	padding: 6px 10px;
	border-radius: 8px;
	font-size: 0.9375rem;
	line-height: 1.35;
	text-decoration: none;
	color: var(--e-global-color-primary, #45234C);
}
.vh-tcs-toc-list a::before {
	content: counter(vh-toc) ". ";
	font-weight: 700;
}
.vh-tcs-toc-list a:hover,
.vh-tcs-toc-list a:focus-visible {
	background: var(--e-global-color-secondary, #C6AEFF);
	color: #000000;
	outline: none;
}
.vh-tcs-toc-list a[aria-current="true"] {
	background: var(--e-global-color-primary, #45234C);
	color: #FFFFFF;
}

/* ---- body ---- */
.vh-tcs-updated {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--e-global-color-primary, #45234C);
	margin: 0 0 24px;
}
.vh-tcs-section {
	margin: 0 0 36px;
}
.vh-tcs-section h2 {
	color: var(--e-global-color-primary, #45234C);
	margin: 0 0 12px;
}
.vh-tcs-section p,
.vh-tcs-section li {
	max-width: 70ch;
	line-height: 1.6;
}
.vh-tcs-section ul,
.vh-tcs-section ol {
	padding-left: 1.4em;
	margin: 0 0 1em;
}
.vh-tcs-section li {
	margin-bottom: 0.6em;
}
/* brand-pink AAA links (berry 11.03:1 on white — see style.css
 * .vh-link-pink notes; midlife blue #005ABC was only 6.2:1) */
.vh-tcs-section a {
	color: #720065; /* --viya-berry */
	text-decoration: underline;
	text-underline-offset: 0.15em;
}
.vh-tcs-section a:hover,
.vh-tcs-section a:active {
	color: #390047; /* --viya-deep-purple */
}
.vh-tcs-section a:focus-visible {
	color: #390047;
	outline: 2px solid #720065;
	outline-offset: 2px;
}

/* ---- desktop: sticky sidebar layout ---- */
@media (min-width: 1025px) {
	.vh-tcs {
		grid-template-columns: 300px minmax(0, 1fr);
		gap: 48px;
		padding-top: 40px;
	}
	.vh-tcs-toc {
		top: 140px;
	}
	/* sidebar always expanded on desktop, no marker */
	.vh-tcs-toc-heading {
		pointer-events: none;
		list-style: none;
	}
	.vh-tcs-toc-heading::-webkit-details-marker,
	.vh-tcs-toc-heading::marker {
		display: none;
		content: "";
	}
	.vh-tcs-toc-details[open] .vh-tcs-toc-heading,
	.vh-tcs-toc-heading {
		font-size: 0.6875rem;
		font-weight: 900;
		text-transform: uppercase;
		letter-spacing: 0.15em;
	}
}

/* ---- mobile: collapsed sticky bar under the site header ---- */
@media (max-width: 1024px) {
	.vh-tcs-toc {
		top: 90px;
	}
	.vh-tcs-section {
		scroll-margin-top: 150px;
	}
}