/* The brand left-bar (color + width) is owned by theme.json so it stays single-source
   and stays adjustable in Styles -> Blocks -> Quote. */
.wp-block-quote {
	border-radius: var(--wp--custom--panel--radius);
	padding-inline-start: var(--wp--preset--spacing--large);
	padding-inline-end: var(--wp--preset--spacing--medium);
	padding-block: var(--wp--preset--spacing--medium);
	gap: var(--wp--preset--spacing--small);
	background-color: var(--wp--preset--color--surface-2);
	color: var(--wp--preset--color--text-1);
}

/* theme.json has no logical border side, so its bar is on the left. In a right-to-left language the bar moves to
   the start of the text. */
.wp-block-quote:dir(rtl) {
	border-left: 0;
	border-right: var(--wp--custom--border--width--thick) solid var(--wp--preset--color--link);
}

/* Quote text: italic with slightly larger size for emphasis */
.wp-block-quote p {
	font-style: italic;
	font-size: var(--wp--preset--font-size--l);
	line-height: var(--wp--custom--typography--line-height-body);
}

.wp-block-quote cite,
.wp-block-quote footer {
	display: block;
	margin-block-start: var(--wp--preset--spacing--small);
	font-size: var(--wp--preset--font-size--s);
	font-style: normal;
	color: var(--wp--preset--color--text-2);
}