// Namespace
.c-content {
	blockquote,
	figcaption,
	li,
	p {
		code {
			@include var(background-color, code-background);
			@include var(color, body-text);
			border: 4px solid;
			@include var(border-color, code-background);
			font-size: 90%;
			padding: 0 0.25ch;
			word-break: normal;

			// User queries
			@media screen and (-ms-high-contrast: active) {
				border: none;
			}
		}
	}


	kbd {
		margin-left: 0.25ch;
		margin-right: 0.25ch;
	}


	// Blockquote
	//
	// Style guide: Components.post.blockquote
	blockquote {
		@include var(background-color, card-background);
		background-image: url("#{$path-to-img}/posts/blockquote.svg");
		background-repeat: no-repeat;
		background-position: top 1rem left -0.25rem;
		margin-left: map-get($global-post-content-inset, small) * -1;
		padding: 1.5rem 1rem;

		p:first-of-type {
			margin-bottom: 0;
		}

		// Breakpoints
		@include mappy-bp(palm-medium) {
			background-position: 1rem 1rem;
			padding: 1.5rem 2rem;
		}

		@include mappy-bp(palm-large) {
			max-width: calc(#{$global-type-measure} * 1.25);
		}

		footer {
			font-size: 90%;
			margin-top: $_c-post-vertical-spacing * 0.5;

			cite {
				font-style: normal;
			}
		}
	}

	// Image
	// Style guide: Components.post.image
	img {
		margin-top: 4ex;
		filter: var(--image-filter);
	}

	// Figure
	//
	// Style guide: Components.post.figure
	figure {
		margin-top: 4ex;

		figcaption {
			@include var(background-color, card-background);
			@include var(color, card-text);
			border-bottom: $border-hairline solid currentColor;
			font-family: $font-family-secondary;
			line-height: $line-height-tight;
			margin-top: 0.75rem;
			padding: 1rem;
		}
	}


	// Preformatted Text
	//
	// Style guide: Components.post.pre
	pre {
		margin-left: map-get($global-post-content-inset, small) * -1;
		width: calc(100% + #{map-get($global-post-content-inset, small)} * 2);

		// Breakpoints
		@include mappy-bp(palm-large) {
			max-width: calc(#{$global-type-measure} * 1.5);
		}

		code {
			line-height: $line-height-double;
			white-space: pre;
		}
	}

	// Code Examples
	//
	// Style guide: Components.post.code-examples
	pre[class^="language"] {
		--filename: url("#{$path-to-img}/posts/section-code-lightmode.svg");
		--filename-dark: url("#{$path-to-img}/posts/section-code-darkmode.svg");
		@include post-content-flourish(197, -0.5rem);
		@include var(background-color, rte-code-background);

		margin-top: 4ex;
	}


	// Table
	//
	// Style guide: Components.post.table
	table {
		margin-left: map-get($global-post-content-inset, small) * -1;
	}
}
