/**
 * ACAART Article Design - table of contents.
 *
 * Loaded only when the table of contents is enabled.
 *
 * NUMBERING
 * ---------
 * This file deliberately contains no `counter-reset`, no `counter-increment`
 * and no `content: counter(...)`. Entry numbers are printed as text by PHP, so
 * the document has exactly one numbering source and the "1. 01" double number
 * cannot occur.
 *
 * The list is a `<ul>` rather than an `<ol>` for the same reason: an ordered
 * list invites the theme to restore `list-style: decimal` at a specificity our
 * reset would have to fight. The markers below are neutralised at two-class
 * specificity, which outranks the usual `.entry-content ol li` theme rule
 * without a single `!important`.
 */

.acaart-pad-article .acaart-pad-toc {
	border: 1px solid var(--acaart-border);
	border-block-start: 2px solid var(--acaart-accent);
	border-radius: var(--acaart-radius);
	background: var(--acaart-surface);
	box-shadow: var(--acaart-shadow);
	scroll-margin-block-start: var(--acaart-scroll-offset);
}

.acaart-pad-article .acaart-pad-toc__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-inline: 1.25rem;
	padding-block: 0.95rem;
	cursor: pointer;
	list-style: none;
	color: var(--acaart-primary);
}

.acaart-pad-article .acaart-pad-toc__summary::-webkit-details-marker {
	display: none;
}

.acaart-pad-article .acaart-pad-toc__summary::marker {
	content: "";
}

.acaart-pad-article .acaart-pad-toc__title {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	line-height: 1.4;
}

.acaart-pad-article .acaart-pad-toc__chevron {
	flex: 0 0 auto;
	inline-size: 8px;
	block-size: 8px;
	border-inline-end: 1.5px solid var(--acaart-accent);
	border-block-end: 1.5px solid var(--acaart-accent);
	transform: rotate(45deg);
	transition: transform 0.2s ease;
}

.acaart-pad-article .acaart-pad-toc__panel[open] .acaart-pad-toc__chevron {
	transform: rotate(-135deg);
}

.acaart-pad-article .acaart-pad-toc__body {
	padding-inline: 1.25rem;
	padding-block-end: 1.05rem;
}

/*
 * Marker reset. Two classes beat the common `.entry-content ul li` theme rule,
 * and `content: none` removes any generated marker a theme may have added.
 */
.acaart-pad-article .acaart-pad-toc__list,
.acaart-pad-article .acaart-pad-toc__sublist {
	list-style: none;
	margin: 0;
	padding: 0;
}

.acaart-pad-article .acaart-pad-toc__item,
.acaart-pad-article .acaart-pad-toc__subitem {
	list-style: none;
	margin: 0;
	padding: 0;
}

.acaart-pad-article .acaart-pad-toc__item::marker,
.acaart-pad-article .acaart-pad-toc__subitem::marker {
	content: "";
}

.acaart-pad-article .acaart-pad-toc__item::before,
.acaart-pad-article .acaart-pad-toc__subitem::before,
.acaart-pad-article .acaart-pad-toc__item::after,
.acaart-pad-article .acaart-pad-toc__subitem::after {
	content: none;
}

.acaart-pad-article .acaart-pad-toc__link {
	display: flex;
	align-items: baseline;
	gap: 0.6em;
	padding-block: 0.36rem;
	color: var(--acaart-text);
	font-size: 0.95rem;
	line-height: 1.5;
	text-decoration: none;
}

.acaart-pad-article .acaart-pad-toc__link:hover,
.acaart-pad-article .acaart-pad-toc__link:focus-visible {
	color: var(--acaart-primary);
	text-decoration: underline;
	text-decoration-color: var(--acaart-accent);
	text-underline-offset: 3px;
}

/* The single numbering source: text printed by PHP. */
.acaart-pad-article .acaart-pad-toc__number {
	flex: 0 0 auto;
	min-inline-size: 1.7em;
	color: var(--acaart-accent);
	font-size: 0.78em;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.04em;
}

.acaart-pad-article .acaart-pad-toc__text {
	flex: 1 1 auto;
}

.acaart-pad-article .acaart-pad-toc__sublist {
	list-style: none;
	margin-inline-start: 0.6em;
	margin-block-end: 0.3rem;
	padding-inline-start: 1.7em;
	border-inline-start: 1px solid var(--acaart-border);
}

/* Third level (H4 under H3) steps in again, without a second rule. */
.acaart-pad-article .acaart-pad-toc__sublist.is-depth-2 {
	margin-inline-start: 0.4em;
	padding-inline-start: 1.1em;
	border-inline-start-style: dotted;
}

.acaart-pad-article .acaart-pad-toc__sublist.is-depth-2 .acaart-pad-toc__link {
	font-size: 0.85rem;
	opacity: 0.92;
}

/* Sub-entries carry no number, so they align with the parent's text column. */
.acaart-pad-article .acaart-pad-toc.is-numbered .acaart-pad-toc__sublist {
	padding-inline-start: 1.4em;
}

.acaart-pad-article .acaart-pad-toc__link--sub {
	padding-block: 0.26rem;
	font-size: 0.89rem;
	color: var(--acaart-muted);
}

.acaart-pad-article .acaart-pad-toc__link.is-active {
	color: var(--acaart-primary);
	font-weight: 700;
}

.acaart-pad-article .acaart-pad-toc__link.is-active .acaart-pad-toc__number {
	color: var(--acaart-primary);
}

/* --------------------------------------------------------------------------
 * Overflow list and toggle
 * ----------------------------------------------------------------------- */

.acaart-pad-article .acaart-pad-toc__more {
	position: relative;
	overflow: hidden;
	transition: max-height 0.28s ease, opacity 0.2s ease;
}

/*
 * Collapsed only once the script has taken over. Before that - and forever if
 * scripting is off - every entry stays visible and reachable.
 */
.acaart-pad-article .acaart-pad-toc.is-collapsed .acaart-pad-toc__more {
	max-block-size: 0;
	opacity: 0;
}

/* The toggle is meaningless without the script, so it stays hidden until then. */
.acaart-pad-article .acaart-pad-toc__toggle {
	display: none;
}

.acaart-pad-article .acaart-pad-toc.is-collapsed .acaart-pad-toc__toggle,
.acaart-pad-article .acaart-pad-toc.is-expanded .acaart-pad-toc__toggle {
	display: inline-flex;
}

.acaart-pad-article .acaart-pad-toc__more.is-open {
	opacity: 1;
}

/* The fade sits over the last visible rows while the list is collapsed. */
.acaart-pad-article .acaart-pad-toc.has-overflow .acaart-pad-toc__body > .acaart-pad-toc__list {
	position: relative;
}

.acaart-pad-article .acaart-pad-toc.is-collapsed .acaart-pad-toc__body > .acaart-pad-toc__list::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-end: 0;
	block-size: 2.4em;
	background: linear-gradient(to bottom, transparent, var(--acaart-surface));
	pointer-events: none;
	transition: opacity 0.2s ease;
}

.acaart-pad-article .acaart-pad-toc.is-expanded .acaart-pad-toc__body > .acaart-pad-toc__list::after {
	content: none;
}

.acaart-pad-article .acaart-pad-toc__toggle {
	align-items: center;
	gap: 0.45em;
	margin-block-start: 0.55rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--acaart-primary);
	font-family: inherit;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	cursor: pointer;
	transition: color 0.18s ease;
}

.acaart-pad-article .acaart-pad-toc__toggle:hover {
	color: var(--acaart-accent);
}

.acaart-pad-article .acaart-pad-toc__toggle-icon {
	inline-size: 7px;
	block-size: 7px;
	border-inline-end: 1.5px solid currentColor;
	border-block-end: 1.5px solid currentColor;
	transform: rotate(45deg) translate(-1px, -1px);
	transition: transform 0.2s ease;
}

.acaart-pad-article .acaart-pad-toc__toggle[aria-expanded="true"] .acaart-pad-toc__toggle-icon {
	transform: rotate(-135deg) translate(-1px, -1px);
}

/* --------------------------------------------------------------------------
 * Sticky panel, wide screens only, opt-in
 * ----------------------------------------------------------------------- */

@media (min-width: 1100px) {
	.acaart-pad-article .acaart-pad-toc.is-sticky {
		position: sticky;
		inset-block-start: calc(var(--acaart-scroll-offset) + 12px);
		z-index: 2;
	}

	.acaart-pad-article .acaart-pad-toc.is-sticky .acaart-pad-toc__body {
		max-block-size: 62vh;
		overflow-y: auto;
	}
}

@media (max-width: 640px) {
	.acaart-pad-article .acaart-pad-toc__summary {
		padding-inline: 1rem;
		padding-block: 0.85rem;
	}

	.acaart-pad-article .acaart-pad-toc__body {
		padding-inline: 1rem;
	}

	.acaart-pad-article .acaart-pad-toc__sublist {
		padding-inline-start: 1.1em;
	}

	.acaart-pad-article .acaart-pad-toc__link {
		padding-block: 0.45rem;
	}
}