.edit-post-visual-editor {
	position: relative;
	padding: 50px 0;

	&,
	& p {
		font-family: $editor-font;
		font-size: $editor-font-size;
		line-height: $editor-line-height;
	}

	& ul,
	& ol {
		margin: 0;
		padding: 0;
	}

	& ul:not(.wp-block-gallery) {
		list-style-type: disc;
	}

	& ol {
		list-style-type: decimal;
	}

	& .button {
		font-family: $default-font;
	}
}

.edit-post-visual-editor .editor-writing-flow__click-redirect {
	// Collapse to minimum height of 50px, to fully occupy editor bottom pad.
	height: 50px;
	width: 100%;
	max-width: $content-width;
	// Offset for: Visual editor padding, block (default appender) margin.
	margin: #{ -1 * $block-spacing } auto -50px;
}

.edit-post-visual-editor .editor-block-list__block {
	margin-left: auto;
	margin-right: auto;
	max-width: $content-width;

	@include break-small() {
		.editor-block-list__block-edit {
			margin-left: -$block-side-ui-padding;
			margin-right: -$block-side-ui-padding;
		}

		&[data-align="full"] > .editor-block-contextual-toolbar,
		&[data-align="wide"] > .editor-block-contextual-toolbar { // don't affect nested block toolbars
			max-width: $content-width + 2;	// 1px border left and right
			margin-left: auto;
			margin-right: auto;
		}
	}

	&[data-align="wide"] {
		max-width: 1100px;
	}

	&[data-align="full"] {
		max-width: none;
	}
}

// This is a focus style shown for blocks that need an indicator even when in an isEditing state
// like for example an image block that receives arrowkey focus.
.edit-post-visual-editor .editor-block-list__block:not( .is-selected )   {
	.editor-block-list__block-edit {
		box-shadow: 0 0 0 0 $white, 0 0 0 0 $dark-gray-900;
		transition: .1s box-shadow .05s;
	}

	&:focus .editor-block-list__block-edit {
		box-shadow: 0 0 0 1px $white, 0 0 0 3px $dark-gray-900;
	}
}

.edit-post-visual-editor .editor-post-title {
	margin-left: auto;
	margin-right: auto;
	max-width: $content-width + ( 2 * $block-side-ui-padding );

	.editor-post-permalink {
		left: $block-padding;
		right: $block-padding;
	}

	@include break-small() {
		padding: 5px #{ $block-side-ui-padding - 1px };	// subtract 1px border, because this is an outline

		.editor-post-permalink {
			left: $block-side-ui-padding;
			right: $block-side-ui-padding;
		}
	}
}

.edit-post-visual-editor .editor-default-block-appender {
	// Default to centered and content-width, like blocks
	max-width: $content-width;
	margin-left: auto;
	margin-right: auto;
	position: relative;

	&[data-root-uid=""] .editor-default-block-appender__content:hover {
		// Outline on root-level default block appender is redundant with the
		// WritingFlow click redirector.
		outline: 1px solid transparent;
	}

	@include break-small() {
		.editor-default-block-appender__content {
			padding: 0 $block-padding;
		}
	}
}

.edit-post-visual-editor .editor-block-list__layout > .editor-block-list__insertion-point {
	max-width: $content-width;
	position: relative;
}
