

.wp-block-image.wp-block-greyd-image {
	display: block;
}

.wp-block-image .components-resizable-box__container {
	display: block;
}

.wp-block-image.wp-block-greyd-image img {
	/* height: inherit;
	width: 100%; */
	display: block;
}

/**
 * Dynamic Image
 */
 
[data-type="greyd/image"] .wp-block[data-align="left"] .wp-block-image {
	display: flex;
	justify-content: start;
}

[data-type="greyd/image"] .wp-block[data-align="right"] .wp-block-image {
	display: flex;
	justify-content: end;
}

[data-type="greyd/image"] .wp-block[data-align="center"] .wp-block-image {
	display: flex;
	justify-content: center;
}

.dynamic_img__preview {
	position: relative;
	display: flex;
	flex-direction: column-reverse;
	justify-content: center;
	align-items: center;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	font-weight: 600;
	padding: 0 4%;
	border: 1px dashed;
	opacity: .5;
}

.components-resizable-box__container .dynamic_img__preview {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

.dynamic_img__preview:not(:empty) {
	background-image: none !important;
}

.dynamic_img__preview svg {
	height: min(48px, 90%);
	width: auto;
}

.dynamic_img__preview span + svg {
	height: min(48px, 45%);
	width: auto;
}

/* selected */
[data-type="greyd/image"].is-selected .dynamic_img__preview {
	background-color: hsla(0, 0%, 100%, .15);
}

[data-type="greyd/image"].is-selected .dynamic_img__preview {
	opacity: 1;
}

[data-type="greyd/image"] .components-resizable-box__container {
	max-width: 100% !important;
}

.wp-block-image.is-style-rounded .dynamic_img__preview {
	border-radius: 9999px;
}

.wp-block-image.is-style-rounded-corners .dynamic_img__preview {
	border-radius: 0.5em;
}

.wp-block-image.is-style-has-shadow .dynamic_img__preview {
	box-shadow: 0px 10px 15px -4px rgba(40, 40, 40, 0.25);
}

.wp-block-image.is-style-diagonal-up .dynamic_img__preview {
	clip-path: polygon(0 12%, 0 100%, 100% 88%, 100% 0);
}

.wp-block-image.is-style-diagonal-down .dynamic_img__preview {
	clip-path: polygon(0 0, 0 88%, 100% 100%, 100% 12%);
}

.wp-block-image.is-style-rotate-left .dynamic_img__preview {
	transform: rotate(357deg);
}

.wp-block-image.is-style-rotate-right .dynamic_img__preview {
	transform: rotate(3deg);
}

.wp-block-image.is-style-tilt-left .dynamic_img__preview {
	transform: perspective(400px) rotateY(10deg);
	box-shadow: -40px 110px 50px -60px rgb(0 0 0 / 15%);
}

.wp-block-image.is-style-tilt-right .dynamic_img__preview {
	transform: perspective(400px) rotateY(350deg);
	box-shadow: 40px 110px 50px -60px rgb(0 0 0 / 15%);
}