/* Experiment log index: a vertical timeline of the notebook's dated entries, under the notebook title. */

/* With an index, the notebook becomes sidebar (title + index) and log. */
@media (min-width: 901px) {
	.sb-experiment-notebook.has-log-toc {
		grid-template-columns: minmax(14rem, 19rem) minmax(0, 52rem);
		column-gap: clamp(var(--sb-space-lg), 5vw, var(--sb-space-2xl, 4rem));
		align-items: start;
	}

	.sb-experiment-notebook.has-log-toc .sb-experiment-notebook__intro h2 {
		font-size: var(--sb-type-step-3);
	}

	/* Sticky only when the whole sidebar fits in the viewport (set by experiment-log-toc.js). */
	.sb-experiment-notebook.has-log-toc .sb-experiment-notebook__intro.is-sticky {
		position: sticky;
		top: calc(var(--sb-header-height, 5rem) + var(--sb-space-md));
	}
}

.sb-log-toc {
	margin-top: var(--sb-space-lg);
}

.sb-log-toc__label {
	margin: 0 0 var(--sb-space-md);
	color: var(--sb-color-muted);
	font-family: var(--sb-font-mono);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.sb-log-toc__list {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* The timeline rail, from the first dot to the last. */
.sb-log-toc__list::before {
	content: "";
	position: absolute;
	inset-block: 1.1rem;
	left: 0.3rem;
	width: 1px;
	background: var(--sb-color-border-strong);
}

.sb-log-toc__item {
	position: relative;
	margin: 0;
	padding: 0;
}

.sb-log-toc__item::before {
	content: "";
	position: absolute;
	top: 0.8rem;
	left: 0;
	width: 0.65rem;
	height: 0.65rem;
	border: 1px solid var(--sb-color-border-strong);
	border-radius: 50%;
	background: var(--sb-color-bg);
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.sb-log-toc__item:hover::before,
.sb-log-toc__item:focus-within::before {
	border-color: var(--sb-color-accent);
	background: var(--sb-color-accent);
}

.sb-log-toc__link {
	display: grid;
	gap: 0.3rem;
	padding: 0.6rem 0 0.6rem 1.75rem;
	color: var(--sb-color-ink);
	font-size: var(--sb-type-step--1, 0.9rem);
	line-height: var(--sb-leading-snug);
	text-decoration: none;
}

.sb-log-toc__date {
	color: var(--sb-color-ink-soft);
	font-family: var(--sb-font-mono);
	font-size: 0.68rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.sb-log-toc__title {
	transition: color 0.2s ease;
}

.sb-log-toc__link:hover .sb-log-toc__title,
.sb-log-toc__link:focus-visible .sb-log-toc__title {
	color: var(--sb-color-accent);
}

/* Anchored entries clear the sticky header. */
.sb-lab-entry[id],
.sb-log-heading[id] {
	scroll-margin-top: calc(var(--sb-header-height, 5rem) + var(--sb-space-md));
}

@media (prefers-reduced-motion: reduce) {
	.sb-log-toc__item::before,
	.sb-log-toc__title {
		transition: none;
	}
}
