/* FILE: global/base/_quote.scss */

blockquote {
	max-width: 100%; // Yes, this is required especially for editor when quote is within a stack.
	margin-inline: 0;
	font-family: var(--wp--custom--quote--font-family);
	font-size: var(--wp--custom--quote--font-size);
	font-weight: 400;
	line-height: var(--wp--custom--quote--line-height);

	.has-background:not(.has-text-color) & {
		color: inherit;
	}

	> cite {
		display: block;
	}

	blockquote {
		font-size: 1em;
	}

	p {
		max-width: none;
		margin-block-start: $ratio_maj + em;

		&:first-of-type::before {
			content: '“';
			display: inline-block;
			margin-inline-end: .1em;
			font-family: var(--wp--custom--quote--decoration--font-family);
			font-size: $ratio * 2em;
			font-weight: 700;
			font-style: normal;
			line-height: .05;
			vertical-align: bottom;
			pointer-events: none;
		}
	}
}

cite {

	&::before {
		content: var(--wp--custom--quote--cite-before);
	}
}
