/**
 * disclosure: loaded only on pages that show it.
 *
 * Split out of the shared stylesheets by bin/split-css.py; loaded by
 * inc/feature-styles.php when something on the page has the class.
 */

/* ---------- From blocks.css ---------- */
/* ---------- A disclosure inside post content ------------------------------ *
 *
 * Imported posts carry a "Read the Transcript" panel that arrived without the
 * element that opened and shut it. These are the same shape as the FAQ's
 * questions, because they are the same control — a label you press and a
 * panel underneath — and a reader should not have to learn two of them.
 * ------------------------------------------------------------------------- */

.cong-disclosure {
	margin-block: var(--wp--preset--spacing--40);
	border-block: 1px solid var(--cong-line);
}

.cong-disclosure > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--20);
	padding-block: var(--wp--preset--spacing--30);
	cursor: pointer;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 600;
	list-style: none;
}

.cong-disclosure > summary::-webkit-details-marker { display: none; }

/* The same chevron the FAQ uses, rotated when the panel is open. */
.cong-disclosure > summary::after {
	content: "";
	flex: 0 0 auto;
	inline-size: 0.6em;
	block-size: 0.6em;
	border-inline-end: 2px solid var(--wp--preset--color--leaf);
	border-block-end: 2px solid var(--wp--preset--color--leaf);
	transform: rotate(45deg) translate(-0.1em, -0.1em);
	transition: transform var(--wp--custom--transition--base);
}

.cong-disclosure[open] > summary::after {
	transform: rotate(225deg) translate(-0.15em, -0.15em);
}

/* A transcript is long and secondary, so it reads a size down from the post. */
.cong-disclosure > :not(summary) {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--ink-muted);
}

.cong-disclosure > :last-child {
	margin-block-end: var(--wp--preset--spacing--30);
}
