/*
 * INet TOC for Elementor
 * Structural styles and safe defaults. Every visual value below can be
 * overridden from the Elementor panel (Style tab) via widget selectors.
 */

.inet-toc {
	--inet-toc-rail-w: 1px;
	--inet-toc-marker-w: 2px;
	--inet-toc-pad: 16px;
	--inet-toc-sub: 14px;
	--inet-toc-num-w: 28px;
	--inet-toc-offset: 100px;
	box-sizing: border-box;
	max-width: 100%;
}

.inet-toc *,
.inet-toc *::before,
.inet-toc *::after {
	box-sizing: border-box;
}

.inet-toc[hidden] {
	display: none;
}

/* Head: title + mobile toggle ---------------------------------------- */

.inet-toc__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
}

.inet-toc__title {
	margin: 0;
	padding: 0;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	color: #12241c;
}

.inet-toc__toggle {
	display: none;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	margin: -8px;
	padding: 8px;
	cursor: pointer;
}

/* Reset theme button styles (Hello, Astra etc. style bare <button>). */
.inet-toc .inet-toc__toggle,
.inet-toc .inet-toc__toggle:hover,
.inet-toc .inet-toc__toggle:focus {
	background: transparent;
	border: 0;
	border-radius: 4px;
	box-shadow: none;
	color: inherit;
	text-transform: none;
}

.inet-toc .inet-toc__toggle:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 0;
}

.inet-toc__chevron {
	position: relative;
	top: -2px;
	display: block;
	width: 9px;
	height: 9px;
	border-style: solid;
	border-color: #1f4b3a;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
}

.inet-toc.is-collapsible.is-open .inet-toc__chevron {
	top: 2px;
	transform: rotate(-135deg);
}

.inet-toc.is-collapsible .inet-toc__head {
	cursor: pointer;
}

/* Body --------------------------------------------------------------- */

.inet-toc__body {
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
}

.inet-toc.is-collapsible:not(.is-open) .inet-toc__body {
	display: none;
}

/* List and the vertical line ----------------------------------------- */

.inet-toc__list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-left: var(--inet-toc-rail-w) solid #e5dfd1;
	counter-reset: inet-toc;
}

.inet-toc__item {
	margin: 0;
	padding: 0;
	list-style: none;
}

.inet-toc__item--d0 {
	counter-increment: inet-toc;
}

.inet-toc__empty {
	margin: 0;
	padding: 6px 0 6px var(--inet-toc-pad);
	font-size: 14px;
	line-height: 1.4;
	color: #4f6058;
}

/* Links -------------------------------------------------------------- */

.inet-toc__link {
	position: relative;
	display: block;
	padding: 6px 8px 6px var(--inet-toc-pad);
	font-size: 15px;
	line-height: 1.4;
	color: #4f6058;
	overflow-wrap: anywhere;
	transition-property: color, background-color;
	transition-duration: 150ms;
	transition-timing-function: ease;
}

.inet-toc__link,
.inet-toc__link:hover,
.inet-toc__link:focus {
	text-decoration: none;
	box-shadow: none;
}

.inet-toc__link:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: -2px;
}

.inet-toc__item--d1 > .inet-toc__link {
	padding-left: calc(var(--inet-toc-pad) + var(--inet-toc-sub));
}

.inet-toc__item--d2 > .inet-toc__link {
	padding-left: calc(var(--inet-toc-pad) + 2 * var(--inet-toc-sub));
}

/* Active marker: sits on top of the vertical line. */
.inet-toc__link::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(var(--inet-toc-rail-w) * -1);
	width: var(--inet-toc-marker-w);
	background-color: transparent;
	transition: background-color 150ms ease;
	pointer-events: none;
}

.inet-toc__link.is-active::after {
	background-color: #1f4b3a;
}

/* Numbering (main level only) ---------------------------------------- */

.inet-toc--num-decimal .inet-toc__item--d0 > .inet-toc__link,
.inet-toc--num-zero .inet-toc__item--d0 > .inet-toc__link {
	display: grid;
	grid-template-columns: var(--inet-toc-num-w) minmax(0, 1fr);
	align-items: baseline;
}

.inet-toc--num-decimal .inet-toc__item--d0 > .inet-toc__link::before,
.inet-toc--num-zero .inet-toc__item--d0 > .inet-toc__link::before {
	font-variant-numeric: tabular-nums;
}

.inet-toc--num-decimal .inet-toc__item--d0 > .inet-toc__link::before {
	content: counter(inet-toc, decimal);
}

.inet-toc--num-zero .inet-toc__item--d0 > .inet-toc__link::before {
	content: counter(inet-toc, decimal-leading-zero);
}

/* Motion preferences -------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.inet-toc__link,
	.inet-toc__link::after,
	.inet-toc__chevron {
		transition-duration: 0.01ms !important; /* must beat the per-widget duration set by Elementor */
	}
}
