/*!
Newspack Scott 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";

.accent-header,
.article-section-title {
	color: #666;
	font-family: var(--newspack-theme-font-heading);
	font-size: var(--newspack-theme-font-size-sm);

	&::before {
		background-color: var(--newspack-theme-color-primary);
		content: "";
		display: inline-block;
		height: 0.75em;
		margin: 0 0.75em 0 0;
		position: relative;
		width: 0.75em;
		top: 3px;
	}
}

.entry-meta .byline a,
.wpnbha .entry-meta .byline a {
	color: var(--newspack-theme-color-text-light);
}

/* Avatar */

.avatar {
	border-radius: 0;
}

/** === Paragraph === */

.has-drop-cap:not(:focus)::first-letter {
	font-family: var(--newspack-theme-font-heading);
	font-weight: bold;
}

//! Newspack Article Carousel
.wp-block-newspack-blocks-carousel {
	.entry-meta .byline a {
		color: inherit;
	}
}

.wp-block-pullquote {
	border-width: 0;
	font-weight: bold;
	padding-top: #{3 * structure.$size__spacing-unit};
	position: relative;
	text-align: center;

	.block-library-pullquote__content {
		position: relative;
		z-index: 1;
	}

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

		&::before,
		&::after {
			border-top: 2px solid;
			border-top-color: var(--newspack-theme-color-primary);
			content: "";
			display: block;
			position: absolute;
			opacity: 0.8;
			top: #{2 * structure.$size__spacing-unit};
		}

		&::before {
			left: 15%;
			right: calc(50% + 2em);
		}

		&::after {
			left: calc(50% + 2em);
			right: 15%;
		}
	}

	&[style*="border-color"] blockquote {
		&::before,
		&::after {
			border-top-color: inherit;
		}
	}

	blockquote p:first-of-type::before {
		color: var(--newspack-theme-color-primary);
		content: "\201C";
		display: inline-block;
		font-family: var(--newspack-theme-font-heading);
		font-size: calc(1rem * 6);
		font-style: italic;
		font-weight: normal;
		left: calc(50% - 0.3em);
		line-height: 0.75;
		position: absolute;
		text-align: center;
		top: 0.2em;
		width: 0.5em;
		z-index: 1;

		@include utilities.media( tablet ) {
			font-size: calc(1rem * 8);
		}
	}

	&.is-style-solid-color,
	&.has-background {
		blockquote::before,
		blockquote::after {
			border-top-color: currentcolor;
		}

		p:first-of-type::before {
			color: inherit;
		}
	}

	&.is-style-solid-color blockquote {
		padding-top: #{2 * structure.$size__spacing-unit};
	}

	&.has-background blockquote {
		padding-top: structure.$size__spacing-unit;
	}

	&.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-size: var(--newspack-theme-font-size-sm);
		font-weight: normal;
		text-transform: uppercase;
	}

	&.has-text-align-left,
	&.has-text-align-right {
		blockquote::after {
			display: none;
		}

		blockquote p:first-of-type::before {
			width: 0.5em;
		}

		&.is-style-solid-color blockquote,
		&.has-background blockquote {
			padding-top: #{1.5 * structure.$size__spacing-unit};
		}
	}

	&.has-text-align-left {
		blockquote::before {
			left: 4em;
			right: 0;
		}

		blockquote p:first-of-type::before {
			left: 0;
			text-align: left;
		}

		&.is-style-solid-color blockquote {
			&::before {
				left: #{5 * structure.$size__spacing-unit};
				right: #{2 * structure.$size__spacing-unit};
			}

			p:first-of-type::before {
				left: #{1.5 * structure.$size__spacing-unit};
			}
		}
	}

	&.has-text-align-right {
		blockquote::before {
			right: 3em;
			left: 0;
		}

		blockquote p:first-of-type::before {
			left: auto;
			right: 0;
			text-align: right;
		}

		&.is-style-solid-color blockquote {
			&::before {
				right: #{5 * structure.$size__spacing-unit};
				left: #{2 * structure.$size__spacing-unit};
			}

			p:first-of-type::before {
				right: #{1.5 * structure.$size__spacing-unit};
			}
		}
	}

	&[style*="border-width"] {
		blockquote {
			margin-top: 0;
		}

		p:first-of-type::before,
		blockquote::before,
		blockquote::after {
			display: none;
		}
	}
}

[data-align="left"] .wp-block-pullquote,
[data-align="right"] .wp-block-pullquote {
	border-width: 0;
	text-align: left;

	blockquote {
		padding-top: #{1.5 * structure.$size__spacing-unit};

		&::before {
			left: 3em;
			right: 0;
		}

		&::after {
			display: none;
		}
	}

	blockquote p:first-of-type::before {
		font-size: calc(1rem * 6);
		left: 0;
		text-align: left;
		top: 0.3em;
		width: 0.5em;
	}

	&.is-style-solid-color,
	&.has-background {
		blockquote {
			&::before {
				left: #{5 * structure.$size__spacing-unit};
				right: #{2 * structure.$size__spacing-unit};
			}

			p:first-of-type::before {
				left: #{1.5 * structure.$size__spacing-unit};
			}
		}
	}

	&.is-style-solid-color blockquote {
		padding-top: #{1.5 * structure.$size__spacing-unit};
	}

	&.has-background blockquote {
		padding-top: #{0.5 * structure.$size__spacing-unit};
	}

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