/* Compléments que les réglages natifs des blocs ne couvrent pas. */
.mi-blog-layout,
.mi-article-layout {
	display: grid;
	align-items: start;
	gap: var(--wp--preset--spacing--70);
}

.mi-blog-layout {
	grid-template-columns: 250px minmax(0, 1fr);
}

.mi-blog-layout > *,
.mi-article-layout > * {
	min-width: 0;
	margin-block-start: 0;
}

.mi-blog-sidebar,
.mi-article-sidebar {
	position: sticky;
	top: calc(var(--mf-header-height, 100px) + var(--wp--preset--spacing--40) + var(--mi-blog-admin-offset, 0px));
	max-height: calc(100svh - var(--mf-header-height, 100px) - 80px);
	overflow-y: auto;
	overscroll-behavior: contain;
}

.admin-bar :is(.mi-blog, .mi-article) {
	--mi-blog-admin-offset: 32px;
}

.mi-blog-sidebar .wp-block-categories-list {
	list-style: none;
	padding-inline-start: 0;
}

.mi-blog-sidebar a,
.mi-article-sidebar a {
	display: block;
	padding-block: var(--wp--preset--spacing--20);
	color: var(--wp--preset--color--text-content);
}

.mi-blog-sidebar a[aria-current] {
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Le bloc Recherche garde ses éléments natifs ; le focus porte sur le champ. */
.mi-blog-sidebar .wp-block-search__label {
	display: block;
	margin-block-end: var(--wp--preset--spacing--20);
}

.mi-blog-sidebar .wp-block-search__inside-wrapper {
	border-color: var(--wp--preset--color--border-field);
}

.mi-blog-sidebar .wp-block-search__inside-wrapper:focus-within {
	outline: 2px solid var(--wp--preset--color--bg-dark);
	outline-offset: 0;
}

.mi-blog-sidebar .wp-block-search__button {
	min-inline-size: 44px;
	min-block-size: 44px;
	padding: 0;
}

.mi-blog :is(a, button):focus-visible,
.mi-article :is(a, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--bg-dark);
	outline-offset: 2px;
}

.mi-blog-sidebar .wp-block-search__button:focus-visible {
	outline-color: var(--wp--preset--color--text-title-dark);
	outline-offset: -3px;
}

.mi-article-sidebar a:focus-visible {
	outline-offset: -2px;
}

.mi-article-layout {
	grid-template-columns: minmax(0, var(--wp--custom--blog--reading-width, 760px));
	justify-content: center;
}

.mi-article--has-toc .mi-article-layout,
.editor-styles-wrapper .mi-article-layout {
	grid-template-columns: minmax(0, var(--wp--custom--blog--reading-width, 760px)) minmax(220px, 280px);
}

.mi-article-layout > :last-child {
	grid-column: 1;
	grid-row: 1;
}

.mi-article-sidebar {
	display: none;
	grid-column: 2;
	grid-row: 1;
	font-size: var(--wp--preset--font-size--small);
}

.mi-article--has-toc .mi-article-sidebar,
.editor-styles-wrapper .mi-article-sidebar {
	display: block;
}

.mi-article-sidebar ol {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: var(--wp--preset--spacing--20);
}

.mi-article-sidebar nav a {
	border-inline-start: 2px solid transparent;
	padding-inline-start: var(--wp--preset--spacing--30);
	line-height: 1.6;
	text-decoration: none;
}

.mi-article-sidebar nav a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.mi-article-sidebar nav a[aria-current] {
	border-inline-start-color: var(--wp--preset--color--bg-dark);
	color: var(--wp--preset--color--bg-dark);
	font-weight: 500;
}

.mi-article-sidebar > .wp-block-heading {
	display: none;
}

/* Dans l’éditeur, les deux libellés restent disponibles à la modification. */
.editor-styles-wrapper .mi-article-sidebar > .wp-block-heading {
	display: block;
}

.mi-article-sidebar summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	min-block-size: 44px;
	font-weight: 500;
	cursor: pointer;
	list-style: none;
}

.mi-article-sidebar summary::-webkit-details-marker {
	display: none;
}

.mi-article-sidebar summary::after {
	content: "";
	flex: 0 0 auto;
	inline-size: 8px;
	block-size: 8px;
	margin-inline: 3px;
	border-inline-end: 1.5px solid currentColor;
	border-block-end: 1.5px solid currentColor;
	transform: rotate(45deg);
}

.mi-article-sidebar details[open] > summary::after {
	transform: rotate(225deg);
}

@media (min-width: 960px) {
	.mi-article--has-toc .mi-article-sidebar > .wp-block-heading {
		display: block;
	}

	.mi-article--has-toc .mi-article-sidebar:has(> .wp-block-heading) summary {
		display: none;
	}
}

.mi-article-sidebar [data-level="3"] {
	margin-inline-start: var(--wp--preset--spacing--40);
}

.mi-article .wp-block-post-content :is(h2, h3) {
	scroll-margin-block-start: calc(var(--mf-header-height, 100px) + var(--wp--preset--spacing--40) + var(--mi-blog-admin-offset, 0px));
}

@media (max-width: 959px) {
	.mi-blog-layout,
	.mi-article--has-toc .mi-article-layout,
	.editor-styles-wrapper .mi-article-layout {
		grid-template-columns: minmax(0, 1fr);
	}

	.mi-blog-sidebar a,
	.mi-article-sidebar nav a {
		min-block-size: 44px;
		box-sizing: border-box;
	}

	.mi-blog-sidebar,
	.mi-article-sidebar {
		position: static;
		max-height: none;
		overflow: visible;
	}

	.mi-article-sidebar,
	.mi-article-layout > :last-child {
		grid-column: 1;
		grid-row: auto;
	}
}

@media (max-width: 782px) {
	.admin-bar :is(.mi-blog, .mi-article) {
		--mi-blog-admin-offset: 46px;
	}
}

@media (max-width: 600px) {
	.admin-bar :is(.mi-blog, .mi-article) {
		--mi-blog-admin-offset: 0px;
	}

	.mi-blog-layout .wp-block-post-template,
	.mi-article__related .wp-block-post-template {
		grid-template-columns: minmax(0, 1fr);
	}
}