.editor-styles-wrapper {
	/*
	 * Add padding in the editor for the comments template part.
	 * Not sure if this might conflict with full/wide alignments at all.
	 */
	.wp-site-blocks:has(> .comments-area) {
		padding: 0 80px;
	}

	.wp-block-navigation__container > .wp-element-button {
		padding: 0;
	}

	/* 
	 * Add styles for Details block, as block
	 * filter does not add correct class in Editor.
	 */
	.wp-block-details.is-style-details-button summary {
		border-radius: var(--wp--custom--elements--button--border--radius);
		background-color: var(--wp--custom--elements--button--color--background);
		color: var(--wp--custom--elements--button--color--text);
		padding-bottom: var(--wp--custom--elements--button--spacing--padding--bottom);
		padding-left: var(--wp--custom--elements--button--spacing--padding--left);
		padding-right: var(--wp--custom--elements--button--spacing--padding--right);
		padding-top: var(--wp--custom--elements--button--spacing--padding--top);
		font-size: var(--wp--custom--elements--button--typography--font-size);
		font-weight: var(--wp--custom--elements--button--typography--font-weight);
		letter-spacing: var(--wp--custom--elements--button--typography--letter-spacing);
		line-height: var(--wp--custom--elements--button--typography--line-height);
		text-transform: var(--wp--custom--elements--button--typography--text-transform);

		&:hover {
			background-color: var(--wp--custom--elements--button--hover--color--background);
			color: var(--wp--custom--elements--button--hover--color--text);
			text-decoration: var(--wp--custom--elements--button--hover--text-decoration);
		}
		&:active, &:focus {
			background-color: var(--wp--custom--elements--button--active--color--background);
			color: var(--wp--custom--elements--button--active--color--text);
			text-decoration: var(--wp--custom--elements--button--active--text-decoration);
		}
	}
}