/**
 * Cope with theme.json
 */

 // まず .is-root-container でメインエリアを定義している
:is( .alignfull, .alignwide ) {
	 // theme.json があると __inner-container の div は出力されなくなってしまうので max-width にコンテンツ幅を指定
	 // .alert は投稿リストブロックで投稿がない時に出力されるため追加。本当は div にかける方が適切と思われるが、影響範囲が大きそうなので一旦 .alert のみで様子見
	 & > :is( 
		div[class*="wp-container-"],
		div[class*="wp-block-"], 
		div[class*="vk_"],
		.alert,
		:where(:is(h1,h2,h3,h4,h5,h6)) 
		){
		&:where(:not(
			.alignfull,
			.alignwide,
			.wp-block-cover__background,
			.wp-block-cover__image-background,
			.wp-block-column,
			.vk_outer,
			.vk_slider_wrapper,
			.swiper-wrapper,
			.swiper-pagination,
			.is-content-justification-right,
			.is-content-justification-left
			)) {
			max-width: calc( var(--vk-width-container) - var(--vk-width-container-padding) * 2 );
			margin-left:auto;
			margin-right:auto;
		}
	 }
 }

 // theme.json を追加すると a:where(:not(.wp-element-button)){ text-decoration: underline; } が追加されるため打ち消し
 a{
	&.postListText_singleTermLabel_inner,
	&.vk_gridcolcard_item_container {
		text-decoration: none;
	}
}

// 6.1 with theme.json CSS *******************************************/

// Core CSS /////////////////////////////
// body .is-layout-flow > * + * {
//     margin-block-start: 24px;
//     margin-block-end: 0;
// }

// Core CSS /////////////////////////////
// body .is-layout-constrained > * + * {
//     margin-block-start: 24px;
//     margin-block-end: 0;
// }

body .container .is-layout-flow > * + *,
body .is-layout-constrained > * + * {
	margin-block-start: unset;
	&:where(:not(:is(h1,h2,h3,h4,h5,h6,.vk_button))){ //vk_buttonが隣接した時、2個目以降のmargin-bottomが効かなくなるので.vk_buttonを追加
		margin-block-end: unset;
	}
}

// Core CSS /////////////////////////////
// body .is-layout-flow > * {
//     margin-block-start: 0;
//     margin-block-end: 0;
// }
// body .is-layout-constrained > * {
//     margin-block-start: 0;
//     margin-block-end: 0;
// }

// h タグには --vk-margin-headding-bottom 指定追加
body :is( .is-layout-flow, .is-layout-constrained ) > *:is(h1,h2,h3,h4,h5,h6 ) {
	margin-block-end:var(--vk-margin-headding-bottom);
}

body .container :is( .is-layout-flow, .is-layout-constrained ) {
	.wp-block-table,
	p,
	ul,
	ol,
	dl,
	blockquote,
	iframe {
		&:where(:not(:last-child)){
			margin-block-end: var(--vk-margin-element-bottom);
		}
	}
}

// 6.0 with theme.json CSS *******************************************/

// Core CSS /////////////////////////////
// .wp-container-1 > * + * {
//     margin-block-start: var( --wp--style--block-gap );
//     margin-block-end: 0;
// }

div[class*=wp-container-] > * + * {
	margin-block-start:unset;
}
// h タグには --vk-margin-headding-bottom 指定追加
*[class*=wp-container-] > * + *:is(h1,h2,h3,h4,h5,h6){
	margin-block-end:var(--vk-margin-headding-bottom);
}

// Core CSS /////////////////////////////
// .wp-container-1 > * {
//     margin-block-start: 0;
//     margin-block-end: 0;
// }
.wp-block-column,
.wp-block-group {
	&[class*=wp-container-] > :is( p,ul,ol,dl ) {
		margin-block-start:unset;
		margin-block-end:var(--vk-margin-element-bottom);
	}
}
// h タグには --vk-margin-headding-bottom 指定追加
*[class*=wp-container-] > *:is(h1,h2,h3,h4,h5,h6){
	margin-block-end:var(--vk-margin-headding-bottom);
}

// Core CSS /////////////////////////////
// .wp-container-1 {
//     display: flex;
//     gap: var( --wp--style--block-gap, 0.5em );
// }
.wp-block-gallery {
	--wp--style--block-gap:0.5em; // theme.json がないと24pxがはいるが、ない場合は 0.5em だったので継承するための補正
}

// 特定の独自ブロック・クラスの補正 *******************************************/

p:is(.postListText_title,.vk_heading_subtext,.no-margin ){
	--vk-margin-element-bottom:0;
}