/* =========================================
   Responsive Heading Size
========================================= */

/*
 PC時は指定しない。
 Gutenberg標準の「タイポグラフィ > フォントサイズ」、
 またはテーマCSSのPCサイズをそのまま使う。
*/

/*
 991px以下の文字サイズが入力されている時だけ反映する。
 991px以下が空欄の場合は、このルール自体が効かない。
*/
@media (max-width: 991px) {
	.has-responsive-heading-size-tablet {
		font-size: var(--mytheme-heading-size-tablet) !important;
	}
}

/*
 767px以下の文字サイズが入力されている時だけ反映する。
*/
@media (max-width: 767px) {
	.has-responsive-heading-size-sp {
		font-size: var(--mytheme-heading-size-sp) !important;
	}
}

/* 編集画面：BlockListBlock側にクラスが付く場合の保険 */
@media (max-width: 991px) {
	.editor-styles-wrapper .has-responsive-heading-size-tablet.wp-block-heading,
	.editor-styles-wrapper .has-responsive-heading-size-tablet :where(h1, h2, h3, h4, h5, h6, .wp-block-heading) {
		font-size: var(--mytheme-heading-size-tablet) !important;
	}
}

@media (max-width: 767px) {
	.editor-styles-wrapper .has-responsive-heading-size-sp.wp-block-heading,
	.editor-styles-wrapper .has-responsive-heading-size-sp :where(h1, h2, h3, h4, h5, h6, .wp-block-heading) {
		font-size: var(--mytheme-heading-size-sp) !important;
	}
}

/* インスペクター内の説明文 */
.mytheme-responsive-heading-size__note {
	margin: 0 0 12px;
	font-size: 12px;
	line-height: 1.6;
	color: #555;
}