.wp-block-otrt-icons.otrt-icons-block,
.otrt-icons-editor {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
}

.wp-block-otrt-icons .otrt-icons-block__inner {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
}

.wp-block-otrt-icons .otrt-icons-svg,
.otrt-icons-editor .otrt-icons-svg {
	display: block;
	width: 100%;
	height: 100%;
}

.wp-block-otrt-icons .otrt-icons-svg path,
.wp-block-otrt-icons .otrt-icons-svg rect,
.wp-block-otrt-icons .otrt-icons-svg circle,
.wp-block-otrt-icons .otrt-icons-svg ellipse,
.wp-block-otrt-icons .otrt-icons-svg polygon,
.wp-block-otrt-icons .otrt-icons-svg polyline,
.wp-block-otrt-icons .otrt-icons-svg line,
.otrt-icons-editor .otrt-icons-svg path,
.otrt-icons-editor .otrt-icons-svg rect,
.otrt-icons-editor .otrt-icons-svg circle,
.otrt-icons-editor .otrt-icons-svg ellipse,
.otrt-icons-editor .otrt-icons-svg polygon,
.otrt-icons-editor .otrt-icons-svg polyline,
.otrt-icons-editor .otrt-icons-svg line {
	vector-effect: non-scaling-stroke;
}

.otrt-icons-editor {
	min-height: 64px;
	border: 1px dashed #c3c4c7;
	border-radius: 6px;
	background: #fff;
}

.otrt-icons-canvas {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	min-width: 48px;
	min-height: 48px;
	max-width: 100%;
}

.otrt-icons-preview-shell {
	padding: 12px;
	border: 1px solid #dcdcde;
	border-radius: 6px;
	background:
		linear-gradient(45deg, #f6f7f7 25%, transparent 25%),
		linear-gradient(-45deg, #f6f7f7 25%, transparent 25%),
		linear-gradient(45deg, transparent 75%, #f6f7f7 75%),
		linear-gradient(-45deg, transparent 75%, #f6f7f7 75%);
	background-size: 16px 16px;
	background-position: 0 0, 0 8px, 8px -8px, -8px 0;
}

.otrt-icons-search-results {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
	max-height: 160px;
	overflow: auto;
}

.otrt-icons-search-result {
	margin: 0;
}

.otrt-icons-preview {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	min-width: 48px;
	min-height: 48px;
	max-width: 100%;
}

.otrt-icons-preview-label,
.otrt-icons-preview-empty {
	margin: 8px 0 0;
	font-size: 12px;
	color: #50575e;
	word-break: break-word;
}