.editor {
	video { width: 100%;}

	img, video {
		display: block;
		max-width: 100%;
		height: auto;
	}

	img,
	.embed-responsive {
		+ [class*="editor-type"],
		+ .btn {
			margin-top: $sp-3;
		}
	}

	.table {
		margin-bottom: $sp-5;
	}
	.table-responsive {
		margin-bottom: $sp-5;
		.table {
			margin-bottom: 0;
		}
	}
}

.editor-content-home {
	.editor-numbers {
		max-width: 70rem;
		margin-left: auto;
		margin-right: auto;

		&-item {
			position: relative;
			padding: 2.6rem;
			aspect-ratio: 1 / 1;
			align-content: center;
			border: 1px solid $text-color;
			border-radius: 50%;

			p { margin: 0;}

			&:after {
				content: '';
				position: absolute;
				inset: 1rem;
				border: 8px solid $co-alpha;
				border-radius: 50%;
				pointer-events: none;
			}
		}
	}

	.editor-end {
		margin-top: 4rem;
		padding-top: $sp-6;
		border-top: 4px solid $co-gray-80;
	}
}

.editor-content-50-bg {
	&-1 {
		img {
			border-radius: $border-radius-5;
		}
	}
	&-2 {
		.editor-layout {
			padding: $sp-6;
			background-color: $co-gray-90;
			border-radius: $border-radius-5;
		}
	}
}

.editor-layout {
	margin-bottom: $gutter;
}

.editor-type {
	&-title {
		font-size: clampFn($font-size-h1-sm, $font-size-h1);
		line-height: $line-height-title;
	}
	&-subtitle {
		font-size: $font-size-h2;
		line-height: $line-height-title;
	}
	&-text {
		font-size: $font-size-base;
		line-height: $line-height-base;
	}
	&-text-sm {
		font-size: $font-size-small;
		line-height: $line-height-base;
	}
}

.editor-co-1 { color: $text-color;}
.editor-co-2 { color: $co-alpha;}
.editor-co-3 { color: $co-gray-40;}

body:not(.cke_editable) {
	@include mediaQ(smMax) {
		.editor-content-home {
			.editor-numbers {
				max-width: 24rem;
				gap: $sp-6;
			}
		}
	}
}

@include mediaQ(xl) {
	body:not(.cke_editable) .editor-content-100-2 {
		margin-left: -10rem;
		margin-right: -10rem;
	}
}

.cke_editable {
	padding: $sp-5 !important;

	.editor-content {
		.btn { user-select: inherit;}
	}

	.editor-content-lg {
		width: 1300px;
	}
	.editor-content-sm {
		width: 967px;
	}

	.editor-content-100-2 {
		margin-left: -$sp-5;
		margin-right: -$sp-5;
	}

	.col-25_md { width: 25%;}
	.col-33_sm { width: 33.33%;}
	.col-50_sm { width: 50%;}
	.col-66_sm { width: 66.667%;}
	.col-75_md { width: 75%;}

	.editor-layout {
		outline: 2px dotted $co-gray-30;
		outline-offset: -1px;
	}

	img.cke_iframe {
		width: 100% !important;
		background-color: #ddd;
		border: none;
	}
}

.cke_panel_container {
	.cke_panel_list {
		margin: 0;
		padding: 0;
		background-color: #eee;

		.cke_panel_listItem a {
			border-color: transparent;
			border-radius: 0;
		}
	}
}