/* CrusadeCthulhu blog features: table of contents + reading time. */

/* Smooth anchor jumps, with room for Divi's sticky header. Measure the real
   header height on the live site and adjust --ccc-anchor-offset. */
:root {
	--ccc-anchor-offset: 120px;
	--ccc-toc-divider: #e6e2d8;
	--ccc-toc-divider-width: 1px;
	--ccc-toc-title: #5d5a52;
	--ccc-toc-link: inherit;
}

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

h2[id],
h3[id],
h4[id] {
	scroll-margin-top: var(--ccc-anchor-offset);
}

/* ---- Table of contents ----
   No card, kicker, border or padding of its own: the Theme Builder template
   supplies those. !important on the list reset because Divi styles ol/li
   inside its modules with higher-specificity rules (numbers, indent,
   line-height) that would otherwise win. */

.ccc-toc {
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
}

.ccc-toc__title {
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ccc-toc-title);
	margin: 0 0 10px;
}

.ccc-toc .ccc-toc__list,
.ccc-toc .ccc-toc__list--sub {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.4 !important;
}

.ccc-toc .ccc-toc__item {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	/* No borders from the surrounding module's CSS (a Theme Builder Text
	   module putting border-bottom on li would double the hairline). */
	border: 0 !important;
}

/* The hairline: on every item except the first, as a top border, so there
   is exactly one line between any two adjacent titles at any depth.
   Colour and width come from the CrusadeCthulhu settings page
   (--ccc-toc-divider, --ccc-toc-divider-width) or a rule of your own on
   .ccc-toc__divider. Declared after the reset above so it wins. */
.ccc-toc .ccc-toc__divider {
	border-top: var(--ccc-toc-divider-width, 1px) solid var(--ccc-toc-divider) !important;
}

.ccc-toc .ccc-toc__link {
	display: block;
	padding: 9px 0;
	color: var(--ccc-toc-link);
	text-decoration: none;
}

.ccc-toc .ccc-toc__link:hover,
.ccc-toc .ccc-toc__link:focus-visible {
	text-decoration: underline;
}

.ccc-toc .ccc-toc__item--h3 > .ccc-toc__link {
	font-size: 0.94em;
}

.ccc-toc .ccc-toc__item--h4 > .ccc-toc__link {
	font-size: 0.88em;
	opacity: 0.85;
}

/* ---- Reading time ---- */

.ccc-read-time {
	white-space: nowrap;
}

/* ---- Masthead volume / number ---- */

.ccc-masthead {
	white-space: nowrap;
}