@use "sass:math";

.article-header__cont,
.medium-editor, .medium-editor-simple, .medium-editor-no-insert-plugin,
.xprez-feature-boxes, .xprez-download, .xprez-text-content {
	@include cont-width($text-module-column-width);
	@include xprez-mobile-extra-space;
}

.xprez-text-content.mid-width:not(.xprez-text-content-boxed) {
	@include m-width;
	@media (max-width: ($m-width + $m-space)) and (min-width: $break-m) {
		padding-left: $m-space;
		padding-right: $m-space;
	}
}

.xprez-text-content.full-width:not(.xprez-text-content-boxed) {
	@include full-width;
	@media (min-width: $break-m) {
		padding-left: $m-space;
		padding-right: $m-space;
	}
}

// Xprez basic text styles

.xprez-text-content-centered {
	text-align: center;
}

.xprez-text-content, .xprez-text-image,   
.xprez-feature-boxes, .xprez-grid-box {
	@include clearfix;

	a:not(.btn) {
		text-decoration: underline;
	}
}

.xprez-module {

	@if $use-xprez-text-styles {
		color: var(--x-base-color);

		a:not(.btn) {
			color: var(--x-link-color);

			&:hover {
				color: var(--x-link-hover-color);
			}
		}
	}

	p {
		@if $use-xprez-text-styles {
			@include type(	$text-module-p-size,
							$text-module-p-lh,
							$text-module-p-mt,
							$text-module-p-mb);
			font-family: $body-font-family;
		}
	}

	h2 {
		@if $use-xprez-text-styles {
			@include type-fluid($text-module-h2-fluid-size,
								$text-module-h2-lh,
								$text-module-h2-mt,
								$text-module-h2-mb);
			font-family: $heading-font-family;
			font-weight: $text-module-h2-weight;
			letter-spacing: $text-module-heading-letter-spacing;
			color: var(--x-h2-color);

			&:first-child {
				margin-top: 0;
			}
		}
		margin-left: 0;

		span, strong {
			font-weight: $text-module-heading-emphasis-weight !important;
			color: var(--x-heading-emphasis-color);
		}
	}

	h3 {
		@if $use-xprez-text-styles {
			@include type-fluid($text-module-h3-fluid-size,
								$text-module-h3-lh,
								$text-module-h3-mt,
								$text-module-h3-mb);
			font-family: $heading-font-family;
			font-weight: $text-module-h3-weight;
			letter-spacing: $text-module-heading-letter-spacing;
			color: var(--x-h3-color);

			&:first-child {
				margin-top: 0;
			}
		}
		padding-left: 0;

		span, strong {
			font-weight: $text-module-heading-emphasis-weight !important;
			color: var(--x-heading-emphasis-color);
		}
	}

	h4 {
		@if $use-xprez-text-styles {
			@include type(	$text-module-h4-size,
							$text-module-h4-lh,
							$text-module-h4-mt,
							$text-module-h4-mb);
			font-family: $heading-font-family;
			font-weight: $text-module-heading-emphasis-weight !important;
			color: var(--x-h4-color);

			&:first-child {
				margin-top: 0;
			}
		}
	}

	small {
		font-size:$text-module-small-size;
	}

	ul, ol {
		@if $use-xprez-text-styles {
			margin: $text-module-list-mt $text-module-list-h $text-module-list-mb;
			padding: 0 0 0 $text-module-list-ps;
			@include xprez-breakpoint-down($typo-break-s) {
				padding-left: math.div($text-module-list-ps, 2);
			}
			li {
				@include type(	$text-module-list-row-size,
								$text-module-list-row-lh,
								$text-module-list-row-mt,
								$text-module-list-row-mb);
			}
		}
	}

	blockquote {
		@if $use-xprez-text-styles {
			&, p {
				@include type-fluid($text-module-blockquote-fluid-size,
									$text-module-blockquote-lh,
									null,
									null);
				font-family: $body-font-family;
				font-style: normal;
			}
			border: none;
			color: inherit;


			@if $use-xprez-blockquote-box-style {
				&, p {
					padding-left: 0;
				}

				& {
					margin: $text-module-blockquote-mt $text-module-blockquote-ms $text-module-blockquote-mb $text-module-blockquote-me;
				}

				&:before {
					width: 60px;
					content:'';
					display: block;
					border-top: 6px solid var(--x-blockquote-dash-color);
					margin-bottom: $g;
				}

				&:after {
					width: 60px;
					content:'';
					display: block;
					border-bottom: 6px solid var(--x-blockquote-dash-color);
					margin-top: $g;
				}
			}

		}
	}

	img {
		max-width: 100%;
	}

	figure.media {
		&:not(:first-child) {
			margin-top: $text-module-media-mt;
		}

		&:not(:last-child) {
			margin-bottom: $text-module-media-mb;
		}
	}
}

// Specific styles for feature boxes & simple medium editor 

.xprez-feature-boxes, .medium-editor-simple,
.medium-editor-no-insert-plugin  {
	h2 {
		margin-top: .5*$g;
		margin-bottom: .5*$g;

		&:first-child {
			margin-top: 0;
		}
	}

	h3 {
		margin-top: .5*$g;
		margin-bottom: .5*$g;

		&:first-child {
			margin-top: 0;
		}
	}
}

// Medium Editor frontend specific style overrides

.medium-editor {
	font-size: $basefont;
	font-family: $body-font-family;
}







