// Base
@import "base/_variables.scss";
@import "base/_mixins.scss";

// Woo Block Styles
@import "woocommerce/woo-block-styles.scss";

/* Editor Styles
-------------------------------------------------------*/
.editor-styles-wrapper[data-widget-area-id*="blockst-footer-col-"] {
	background-color: #000000;
}

.container {
	max-width: var(--deo-container-width);
	margin-left: auto;
	margin-right: auto;
}

.post-type-post {
	.editor-styles-wrapper
		.edit-post-visual-editor__post-title-wrapper
		> :where(:not(.alignleft):not(.alignright)),
	.editor-styles-wrapper
		.block-editor-block-list__layout.is-root-container
		> :where(:not(.alignleft):not(.alignright):not(.alignfull):not(.alignwide)) {
		max-width: var(--deo-container-width--narrow);
	}
}

.blockst-left-sidebar,
.blockst-right-sidebar {
	.edit-post-visual-editor .wp-block.alignfull,
	.edit-post-visual-editor .wp-block.alignwide {
		max-width: var(--deo-container-width--narrow) !important;
	}

	.edit-post-visual-editor .wp-block[data-align="full"],
	.edit-post-visual-editor .wp-block[data-align="wide"] {
		max-width: var(--deo-container-width);
	}
}

// Wide Images
.blockst-fullwidth {
	.edit-post-visual-editor .wp-block[data-align="wide"] {
		max-width: var(--deo-container-width--wide);
	}

	.edit-post-visual-editor .wp-block[data-align="full"] {
		max-width: none;
	}

	.wp-block[data-align="wide"] {
		max-width: var(--deo-container-width);
	}
}

@include bp-sm-up {
	.wp-block.alignright,
	.wp-block.alignleft {
		max-width: 40%;
	}
}

@include bp-sm-down {
	.wp-block.alignright,
	.wp-block.alignleft {
		float: none;
		margin-right: 0;
		margin-left: 0;
	}

	.wp-block-gallery.alignleft,
	.wp-block-gallery.alignright {
		max-width: 100%;
	}
}

/* Typography
-------------------------------------------------------*/
.edit-post-visual-editor a,
.editor-rich-text__tinymce a {
	color: var(--deo-post-link-color);
	text-decoration: none;
}

.editor-styles-wrapper {
	font-family: var(--deo-body-font);
	color: var(--wp--preset--color--tertiary);
}

.edit-post-visual-editor p,
.edit-post-visual-editor,
.blocks-rich-text__tinymce.mce-content-body {
	font-size: inherit;
}

/* Headings
-------------------------------------------------------*/
.edit-post-visual-editor .editor-post-title__input,
.edit-post-visual-editor h1.wp-block[data-type="core/heading"],
.edit-post-visual-editor h2.wp-block[data-type="core/heading"],
.edit-post-visual-editor h3.wp-block[data-type="core/heading"],
.edit-post-visual-editor h4.wp-block[data-type="core/heading"],
.edit-post-visual-editor h5.wp-block[data-type="core/heading"],
.edit-post-visual-editor h6.wp-block[data-type="core/heading"] {
	font-family: var(--deo-heading-font);
	color: var(--wp--preset--color--secondary);
	font-weight: var(--deo-heading-font-weigth);
}

.editor-post-title__block .editor-post-title__input {
	font-size: var(--wp--preset--font-size--x-large);

	@include bp-lg-up {
		font-size: var(--wp--preset--font-size--2-x-large);
	}
}

.edit-post-visual-editor h1.wp-block[data-type="core/heading"] {
	font-size: var(--deo-h1-size);
}
.edit-post-visual-editor h2.wp-block[data-type="core/heading"] {
	font-size: var(--deo-h2-size);
}
.edit-post-visual-editor h3.wp-block[data-type="core/heading"] {
	font-size: var(--deo-h3-size);
}
.edit-post-visual-editor h4.wp-block[data-type="core/heading"] {
	font-size: var(--deo-h4-size);
}
.edit-post-visual-editor h5.wp-block[data-type="core/heading"] {
	font-size: var(--deo-h5-size);
}
.edit-post-visual-editor h6.wp-block[data-type="core/heading"] {
	font-size: var(--deo-h6-size);
}

@include bp-sm-down {
	.edit-post-visual-editor h1.wp-block[data-type="core/heading"] {
		font-size: var(--deo-h1-size) !important;
	}
	.edit-post-visual-editor h2.wp-block[data-type="core/heading"] {
		font-size: var(--deo-h2-size) !important;
	}
	.edit-post-visual-editor h3.wp-block[data-type="core/heading"] {
		font-size: var(--deo-h3-size) !important;
	}
	.edit-post-visual-editor h4.wp-block[data-type="core/heading"] {
		font-size: var(--deo-h4-size) !important;
	}
}

/* Lists
-------------------------------------------------------*/
dd,
li {
	margin-bottom: 0;
}

.edit-post-visual-editor .wp-block[data-type="core/list"] ol,
.edit-post-visual-editor .wp-block[data-type="core/list"] ul {
	margin-left: 0;
	padding-left: 1.2em;
}

/* Separators
-------------------------------------------------------*/
.wp-block-separator {
	border-top: 0;
	border-color: var(--deo-border-color);
}

.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
	max-width: 100px !important;
}

.wp-block-separator.is-style-dots:before {
	font-weight: 500;
}

.wp-block-separator.is-style-dots:before {
	color: var(--wp--preset--color--tertiary);
}

/* Tables
-------------------------------------------------------*/
.edit-post-visual-editor {
	table {
		border-spacing: 0;
	}

	td,
	th {
		border-color: var(--deo-border-color);
	}

	th {
		text-align: left;
	}

	.wp-block-table__cell-content {
		padding: 10px;
	}
}

/* Cover Image
-------------------------------------------------------*/
.wp-block-cover,
.wp-block-cover-image {
	font-size: 1rem;
	padding: 2em;
	line-height: 1.3;
}

[data-align="left"] .wp-block-cover,
[data-align="left"] .wp-block-cover-image,
[data-align="right"] .wp-block-cover,
[data-align="right"] .wp-block-cover-image {
	max-width: 100%;
}

[data-align="left"] .wp-block-cover,
[data-align="right"] .wp-block-cover {
	margin-top: 10px;
	margin-bottom: 1.5em;
}

/* Captions
-------------------------------------------------------*/
.wp-block-image figcaption,
.wp-block-embed figcaption,
.wp-block-audio figcaption {
	color: var(--wp--preset--color--tertiary);
	font-size: 0.8125rem;
	text-align: center;
}

/* Buttons
-------------------------------------------------------*/
.wp-block-button .wp-block-button__link {
	@include editor-button;
}

.wp-block-button__link:not(.has-background),
.wp-block-button__link:not(.has-background):active,
.wp-block-button__link:not(.has-background):focus,
.wp-block-button__link:not(.has-background):hover {
	background-color: var(--wp--preset--color--primary);
	color: #fff !important;
}

/* Latest Posts / Categories / Comments
-------------------------------------------------------*/
.edit-post-visual-editor .wp-block-categories ul,
.edit-post-visual-editor ul.wp-block-archives {
	padding-left: 18px;
	margin-left: 0;
}

.edit-post-visual-editor .wp-block-latest-posts {
	padding-left: 0;

	a {
		display: inline-block;
		line-height: 1.3;
	}
}

.wp-block-categories li {
	padding: 10px 0;
	border-bottom: 1px solid var(--deo-border-color);
}

/* Latest Posts
-------------------------------------------------------*/
.wp-block-latest-posts__list {
	overflow: hidden;
}

.wp-block-latest-posts li {
	margin-bottom: 1rem;
}

/* Preformatted / Verse
-------------------------------------------------------*/
.wp-block-code,
.wp-block-preformatted pre,
.wp-block-verse {
	font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
		"Courier New", monospace;
	font-size: 1em;
	margin-top: 0;
	margin-bottom: 1rem;
	overflow: auto;
	color: inherit;
}

.wp-block-verse pre,
pre.wp-block-verse {
	color: inherit;
	padding: 0;
}

/* Blockquotes
-------------------------------------------------------*/
blockquote {
	margin: 0;
	overflow: hidden;

	p {
		font-style: italic;
	}
}

.edit-post-visual-editor {
	.wp-block-quote {
		padding: 12px 40px;
		border-left: 3px solid var(--wp--preset--color--primary);

		&[style*="text-align: left"] {
			border-left: 3px solid var(--wp--preset--color--primary);
		}

		&[style*="text-align: center"] {
			border: 0;
		}

		&[style*="text-align: right"] {
			border-right: 3px solid var(--wp--preset--color--primary);
			border-left: 0;
		}
	}

	.wp-block-quote p {
		color: var(--wp--preset--color--secondary);
		line-height: 1.6;
		font-size: 1.5rem;
		margin-bottom: 5px;
	}

	.wp-block-quote__citation {
		font-size: 0.875rem;
		font-style: normal;
		color: var(--wp--preset--color--tertiary);
		opacity: 0.7;
	}

	// Large
	.wp-block-quote.is-large p,
	.wp-block-quote.is-style-large p {
		font-size: 2rem;
	}

	.wp-block-quote.is-style-large .wp-block-quote__citation,
	.wp-block-quote.is-large .wp-block-quote__citation {
		font-size: 1rem;
	}
}

/* Pullquotes
-------------------------------------------------------*/
.wp-block-pullquote {
	position: relative;
	border: 0;
	text-align: left;
	color: var(--wp--preset--color--secondary);
	margin-top: 0;
	padding: 0.2em 1em 0.2em 2.5em;

	blockquote p {
		margin-bottom: 0;
		font-style: italic;
	}

	[data-align="left"] &,
	[data-align="right"] & {
		font-size: 1rem;
	}

	&::before {
		content: "“";
		color: var(--wp--preset--color--primary);
		left: 0;
		top: 0;
		position: absolute;
		font-size: 5rem;
		line-height: 1;
	}

	.wp-block-pullquote__citation {
		text-transform: none;
		opacity: 0.7;
		font-style: normal;
		font-size: 1rem;
		margin-top: 1em;
	}

	// Solid
	&.is-style-solid-color {
		margin-top: 10px;
		padding: 40px 0;

		&::before {
			left: 10px;
			top: 10px;
		}
	}
}

/* Woo Blocks
-------------------------------------------------------*/
.wc-block-grid__product-onsale {
	position: absolute;
	z-index: 9;
	padding: 6px 12px;
	font-size: 0.625rem;
	left: 10px;
	top: 10px;
	right: auto;
	margin: 0;
	border-radius: 5px;
	min-height: auto;
	line-height: 1;
	background-color: var(--wp--preset--color--secondary);
	color: #ffffff;
	text-transform: uppercase;
}
