.pb-rating-graph[data-type="ponhiro-blocks/rating-graph"] {

	.block-list-appender {
		position: relative;
		margin-top: 2em;
		margin-bottom: 0;
	}

	&:not(.is-selected):not(.has-child-selected) {

		.is-null,
		.block-list-appender {
			display: none;
		}
	}
}

// サイドバーのカラーセット用CSS
.pb-panel--colorSet.-rating-graph {

	span {
		display: block;
	}

	// .__btnBox {
	// 	width: 100%;
	// }

	.pb-rating-graph__item {
		width: 200%;
		max-width: 200%;
		transform: scale(0.5);
		transform-origin: 0 50%;
	}

	.pb-rating-graph__wrap {
		margin: 0 !important;
	}

	.pb-rating-graph__axis {
		display: flex;
		width: 100%;
	}

	.pb-rating-graph {
		margin: 0 !important;
		padding: 12px 8px !important;
	}

	// .pb-rating-graph__scale .__label {
	// 	padding: 0;
	// }

}


// アクティブポイントのチェックボックスを横並びに。
.pb-rating-pointControls {

	margin-bottom: 24px;

	.__checks {
		position: relative;
		display: flex;
		justify-content: space-between;
		padding: 4px;

		&::before {
			position: absolute;
			top: 51%;
			left: 8px;
			z-index: 0;
			display: block;
			width: calc(100% - 16px);
			height: 3px;
			background-color: #e0e3e4;
			transform: translateY(-50%);
			content: "";
		}

		label {
			display: none;
		}

		.components-base-control__field {
			position: relative;
			z-index: 1;
		}

		div,
		.components-checkbox-control__input-container,
		.components-checkbox-control__input {
			margin: 0 !important;
		}
	}
}


.pb-media-setting.-rating-graph {

	.pb-media-setting__preview {
		width: 64px;
		height: 64px;
		margin: 0 0 8px;
		padding: 4px;
		border: dashed 1px #dcdcdc;

		img {
			display: block;
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
	}

	.pb-media-setting__btns {
		display: flex;

		.is-primary {
			margin-right: 8px;
		}
	}
}