/*-------------------------------------------------------*/
/* Gutenberg Front-end Styles
/*-------------------------------------------------------*/
div.blockst-negative-mt-100 {
	margin-top: -100px;
}

// Adjust columns breakpoint
.wp-block-columns {
	flex-wrap: wrap !important;

	@include bp-lg-up {
		flex-wrap: nowrap !important;
	}
}

.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
	@include bp-lg-up {
		flex-basis: 0;
		flex-grow: 1;
	}

	@include bp-lg-down {
		flex-basis: 100% !important;
	}
}

/* Full-width Images
-------------------------------------------------------*/
.alignwide {
	width: auto;
	max-width: none;
	position: relative;
	z-index: 1;

	@include bp-lg-up {
		margin-left: -140px;
		margin-right: -140px;
	}

	@include bp-xl-up {
		margin-left: -220px;
		margin-right: -220px;
	}
}

.alignfull {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: 100vw;
	width: auto;
	position: relative;
	z-index: 1;
}

.blockst-right-sidebar,
.blockst-left-sidebar {
	.alignfull,
	.alignwide {
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
}

.page.blockst-fullwidth .entry__article {
	.alignwide {
		margin-left: 0;
		margin-right: 0;
	}
}

/* Images
-------------------------------------------------------*/
.wp-block-image {
	.alignleft {
		margin-right: 2em;
		max-width: 40%;

		@include bp-sm-down {
			float: none;
			margin-right: 0;
		}
	}

	.alignright {
		margin-left: 2em;
		max-width: 40%;

		@include bp-sm-down {
			float: none;
			margin-left: 0;
		}
	}
}

/* Cover
-------------------------------------------------------*/
.wp-block-cover {
	font-size: 1rem;
	line-height: 1.3;

	&.alignleft {
		margin: 0.5em 2em 1.5em 0;
	}

	&.alignright {
		margin: 0.5em 0 1.5em 2em;
	}
}

.wp-block-cover,
.wp-block-cover-image {
	padding: 2em;
}

.wp-block-cover-image .wp-block-cover-image-text,
.wp-block-cover .wp-block-cover-text,
section.wp-block-cover-image > h2 {
	font-size: 2.25em;
}

/* Tables
-------------------------------------------------------*/
.wp-block-table {
	width: 100%;
	margin-bottom: 2rem;
}

.wp-block-table.is-style-stripes.has-subtle-light-gray-background-color
	tr:nth-child(odd),
.wp-block-table.is-style-stripes tr:nth-child(odd) {
	background-color: #f9f9f9;
}

/* Latest Comments
-------------------------------------------------------*/
ol.wp-block-latest-comments {
	padding-left: 0;
}

/* Galleries
-------------------------------------------------------*/
ul.wp-block-gallery,
.wp-block-gallery ul {
	list-style: none;
	padding-left: 0;
}

/* Captions
-------------------------------------------------------*/
.wp-block-image figcaption,
.wp-block-embed figcaption,
.wp-block-audio figcaption {
	color: var(--wp--preset--color--tertiary);
}

.wp-block-image figcaption {
	margin-top: 1em;
}

/* Separators
-------------------------------------------------------*/
hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 0;
	opacity: 1;
	border-top: 1px solid var(--deo-border-color);
}

.wp-block-separator {
	border-top: 0;
	border-color: var(--deo-border-color);
}

.wp-block-separator:not(.is-style-wide):not(.is-style-dots),
.wp-block-separator.is-style-default {
	max-width: 100px;
	margin-left: auto;
	margin-right: auto;
}

.wp-block-separator.is-style-dots:before {
	font-weight: 500;
	color: var(--wp--preset--color--tertiary);
}

/* Blockquote / Pullquote
-------------------------------------------------------*/
blockquote {
	overflow: hidden;
}

.wp-block-quote {
	&.has-text-align-center {
		border: 0;
	}

	&.has-text-align-right {
		border-left: 0;
		border-right-width: 3px;
		border-right-style: solid;
	}

	&.is-large,
	&.is-style-large {
		padding: 12px 40px;
		margin-top: 40px;
		margin-bottom: 40px;

		p {
			font-size: 2rem;
		}

		cite,
		footer {
			font-size: 1rem;
		}
	}
}

.wp-block-pullquote {
	text-align: left;
	position: relative;
	line-height: 1.5;
	padding: 0.1em 1em 0.2em 2.5em;
	margin-bottom: 30px;
	margin-top: 0;
	color: var(--wp--preset--color--secondary);

	&.alignleft,
	&.alignright {
		font-size: 1rem;
	}

	blockquote {
		margin: 0;
		border: 0;
		padding: 0;
		line-height: normal;
	}

	&::before {
		content: "“";
		color: var(--wp--preset--color--primary);
		left: 0;
		top: 0;
		position: absolute;
		font-size: 5rem;
		line-height: 1;
	}

	p {
		color: inherit;
	}

	cite {
		opacity: 0.7;
	}

	blockquote:not(.has-text-color) cite {
		color: var(--wp--preset--color--tertiary);
	}

	@include bp-sm-up {
		&.alignleft {
			margin-right: 2em /*!rtl:end:ignore*/;
		}

		&.alignright {
			margin-left: 2em /*!rtl:end:ignore*/;
		}
	}
}

// Solid Color
.wp-block-pullquote.is-style-solid-color {
	margin-top: 10px;
	padding: 40px 0;

	&::before {
		left: 10px;
		top: 10px;
	}

	&.alignleft blockquote p,
	&.alignright blockquote p {
		font-size: 1rem;
	}
}

/* Social Icons
-------------------------------------------------------*/
ul.wp-block-social-links {
	padding: 0;

	.wp-social-link a:focus {
		color: currentColor;
		fill: currentColor;
	}
}

/* Latest Posts
-------------------------------------------------------*/
.wp-block-latest-posts {
	&.wp-block-latest-posts__list {
		padding: 0;
	}

	&__post-title {
		display: block;
		font-size: 0.875rem;
		font-weight: var(--deo-heading-font-weigth);
		line-height: 1.3;
	}

	&__featured-image {
		margin-bottom: 10px;
	}

	&__post-author,
	&__post-date {
		font-size: 0.875rem;
		margin-top: 5px;
	}
}

/* Post Navigation
-------------------------------------------------------*/
.wp-block-post-navigation-link {
	a {
		display: inline-flex;
		align-items: center;
		line-height: 1;
		font-weight: 600;
		color: var(--wp--preset--color--secondary);

		&:hover,
		&:focus {
			color: var(--wp--preset--color--primary);
		}
	}

	&.post-navigation-link-next a::after {
		content: "\e902";
		font-family: "blockst";
		margin-left: 6px;
		display: inline-block;
	}

	&.post-navigation-link-previous a::before {
		content: "\e901";
		font-family: "blockst";
		margin-right: 6px;
		display: inline-block;
	}
}
