/*!
Twenty Nineteen Editor Frame Styles

NOTE: This file customizes items that are out of the normal scope of style-editor.css due to the auto-prefixing functionality associated with add_editor_style(). When that file is able to edit the post title and a container similar to .edit-post-layout, these styles should be migrated into style-editor.css. 
*/

/** === Includes === */

@import "sass/variables-site/variables-site";
@import "sass/variables-site/colors";
@import "sass/mixins/mixins-master";

/** === Title === */

body.gutenberg-editor-page .gutenberg .editor-post-title__block {
	@include post-section-dash;

	&:before {
		width: $font__size-xxl;
		margin-top: 0;
		margin-bottom: 0;
		margin-left: 1em;
		position: relative;
		top: 0.5em;
	}

	.editor-post-title__input {
		font-family: $font__heading;
		font-size: $font__size-xxl;
	}
}

/** === Default Appender === */

body.gutenberg-editor-page .gutenberg .editor-default-block-appender__content {
	font-family: $font__body;
	font-size: $font__size_base;
}

/** === Off-Center Content === */

body.gutenberg-editor-page .gutenberg .edit-post-layout {

	@include media(tablet) {
		.editor-writing-flow {
			max-width: 80%;
			margin: 0 10%;
		}

		.editor-post-title__block,
		.editor-default-block-appender,
		.editor-block-list__block {
			margin-left: 0;
			margin-right: 0;
		}

		.editor-block-list__block[data-align="full"] {
			width: calc( 125% + 88px + 28px );
			position: relative;
			left: calc( -12.5% - 46px - 14px );
		}

		.editor-block-list__block[data-align="right"] {
			max-width: 125%;
		}
	}
}