/**
 * Tablet / mobile typography overrides on core text blocks.
 * Desktop stays on native Gutenberg styles.
 * Breakpoints match the editor canvas (782 / 600). Gutenberg tablet preview is 780px.
 *
 * Editor: Gutenberg puts our class on the BlockListBlock wrapper while native
 * font-size often lives on the inner <p>/<h*>. Inner tags inherit when previewing.
 * body.bt-preview-* is set from the editor device type if the iframe is not resized.
 */

@media (max-width: 781px) {
	.has-bt-typo-md-fs {
		font-size: var(--bt-fs-md) !important;
	}
	.has-bt-typo-md-lh {
		line-height: var(--bt-lh-md) !important;
	}
	.has-bt-typo-md-ls {
		letter-spacing: var(--bt-ls-md) !important;
	}

	.editor-styles-wrapper .block-editor-block-list__block.has-bt-typo-md-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
		font-size: inherit !important;
	}
	.editor-styles-wrapper .block-editor-block-list__block.has-bt-typo-md-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
		line-height: inherit !important;
	}
	.editor-styles-wrapper .block-editor-block-list__block.has-bt-typo-md-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
		letter-spacing: inherit !important;
	}
}

@media (max-width: 599px) {
	.has-bt-typo-sm-fs {
		font-size: var(--bt-fs-sm) !important;
	}
	.has-bt-typo-sm-lh {
		line-height: var(--bt-lh-sm) !important;
	}
	.has-bt-typo-sm-ls {
		letter-spacing: var(--bt-ls-sm) !important;
	}

	.editor-styles-wrapper .block-editor-block-list__block.has-bt-typo-sm-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
		font-size: inherit !important;
	}
	.editor-styles-wrapper .block-editor-block-list__block.has-bt-typo-sm-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
		line-height: inherit !important;
	}
	.editor-styles-wrapper .block-editor-block-list__block.has-bt-typo-sm-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
		letter-spacing: inherit !important;
	}
}

/* Editor device preview (Gutenberg setDeviceType). Mobile also inherits tablet rules. */
.bt-preview-tablet .has-bt-typo-md-fs,
.bt-preview-mobile .has-bt-typo-md-fs,
body.is-tablet-preview .has-bt-typo-md-fs,
body.is-mobile-preview .has-bt-typo-md-fs {
	font-size: var(--bt-fs-md) !important;
}
.bt-preview-tablet .has-bt-typo-md-lh,
.bt-preview-mobile .has-bt-typo-md-lh,
body.is-tablet-preview .has-bt-typo-md-lh,
body.is-mobile-preview .has-bt-typo-md-lh {
	line-height: var(--bt-lh-md) !important;
}
.bt-preview-tablet .has-bt-typo-md-ls,
.bt-preview-mobile .has-bt-typo-md-ls,
body.is-tablet-preview .has-bt-typo-md-ls,
body.is-mobile-preview .has-bt-typo-md-ls {
	letter-spacing: var(--bt-ls-md) !important;
}

.bt-preview-mobile .has-bt-typo-sm-fs,
body.is-mobile-preview .has-bt-typo-sm-fs {
	font-size: var(--bt-fs-sm) !important;
}
.bt-preview-mobile .has-bt-typo-sm-lh,
body.is-mobile-preview .has-bt-typo-sm-lh {
	line-height: var(--bt-lh-sm) !important;
}
.bt-preview-mobile .has-bt-typo-sm-ls,
body.is-mobile-preview .has-bt-typo-sm-ls {
	letter-spacing: var(--bt-ls-sm) !important;
}

.bt-preview-tablet .block-editor-block-list__block.has-bt-typo-md-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
.bt-preview-mobile .block-editor-block-list__block.has-bt-typo-md-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-tablet-preview .block-editor-block-list__block.has-bt-typo-md-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-mobile-preview .block-editor-block-list__block.has-bt-typo-md-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
	font-size: inherit !important;
}
.bt-preview-tablet .block-editor-block-list__block.has-bt-typo-md-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
.bt-preview-mobile .block-editor-block-list__block.has-bt-typo-md-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-tablet-preview .block-editor-block-list__block.has-bt-typo-md-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-mobile-preview .block-editor-block-list__block.has-bt-typo-md-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
	line-height: inherit !important;
}
.bt-preview-tablet .block-editor-block-list__block.has-bt-typo-md-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
.bt-preview-mobile .block-editor-block-list__block.has-bt-typo-md-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-tablet-preview .block-editor-block-list__block.has-bt-typo-md-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-mobile-preview .block-editor-block-list__block.has-bt-typo-md-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
	letter-spacing: inherit !important;
}

.bt-preview-mobile .block-editor-block-list__block.has-bt-typo-sm-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-mobile-preview .block-editor-block-list__block.has-bt-typo-sm-fs > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
	font-size: inherit !important;
}
.bt-preview-mobile .block-editor-block-list__block.has-bt-typo-sm-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-mobile-preview .block-editor-block-list__block.has-bt-typo-sm-lh > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
	line-height: inherit !important;
}
.bt-preview-mobile .block-editor-block-list__block.has-bt-typo-sm-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre),
body.is-mobile-preview .block-editor-block-list__block.has-bt-typo-sm-ls > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, li, blockquote, pre) {
	letter-spacing: inherit !important;
}
