/*!
Newspack Sacha Editor Styles
*/

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

@use "variables-style/variables-style";
@use "../../newspack-theme/sass/style-editor-base";
@use "../../newspack-theme/sass/mixins/utilities";
@use "../../newspack-theme/sass/variables-site/structure";

.editor-post-title__block .editor-post-title__input,
h1.wp-block-post-title,
.entry-title {
	font-weight: normal;
}

.accent-header,
.article-section-title {
	align-items: center;
	color: var(--newspack-theme-color-primary-against-white);
	display: flex;
	font-size: var(--newspack-theme-font-size-xs);
	margin-bottom: #{1.5 * structure.$size__spacing-unit};
	overflow: hidden;
	text-align: center;
	width: 100%;

	&::before,
	&::after {
		background: var(--newspack-theme-color-border);
		content: "";
		flex: 1 0 0.5rem;
		height: 1px;
		position: static;
	}

	&::before {
		margin-right: #{0.5 * structure.$size__spacing-unit};
	}

	&::after {
		margin-left: #{0.5 * structure.$size__spacing-unit};
	}
}

.has-drop-cap:not(:focus)::first-letter {
	background-color: var(--newspack-theme-color-primary);
	color: var(--newspack-theme-color-against-primary);
	font-family: var(--newspack-theme-font-heading);
	font-weight: bold;
	font-size: var(--newspack-theme-font-size-xxl);
	padding: 0.4em;
}

figcaption,
.wp-caption-text {
	font-weight: bold;
}

blockquote,
cite {
	font-family: var(--newspack-theme-font-heading);

	em,
	i {
		font-style: normal;
	}
}

.wp-block-pullquote {
	border-width: 2px 0;
	font-style: italic;
	text-align: center;

	blockquote {
		margin: #{2 * structure.$size__spacing-unit} 0;
	}

	&.is-style-solid-color blockquote p,
	blockquote p {
		font-size: var(--newspack-theme-font-size-lg);

		@include utilities.media( tablet ) {
			font-size: var(--newspack-theme-font-size-xl);
		}
	}

	p {
		font-family: var(--newspack-theme-font-heading);
	}

	.wp-block-pullquote__citation {
		font-family: var(--newspack-theme-font-heading);
		font-style: italic;

		em,
		i {
			font-style: normal;
		}
	}
}

[data-align="left"] .wp-block-pullquote,
[data-align="right"] .wp-block-pullquote {
	margin-top: #{1.5 * structure.$size__spacing-unit};
	margin-bottom: #{1.5 * structure.$size__spacing-unit};
	text-align: left;

	@include utilities.media( tablet ) {
		&.is-style-solid-color blockquote p,
		blockquote p {
			font-size: var(--newspack-theme-font-size-lg);
		}
	}
}

.wp-block-cover h2.article-section-title {
	&::before {
		width: 70%;
	}
	&::after {
		display: none;
	}
}

#newspack-post-subtitle-element {
	text-align: center;
}
