/*
 * Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
 */

:root {
	/* This custom property is read by the JS and passed to editor configurations
	as config.ui.viewportOffset.top. */
	--ck-snippet-viewport-top-offset: 109.56;
}

@media (max-width: 960px) {
	:root {
		/* The mobile layout of Umberto is different and the toolbar offset must be
		smaller (https://github.com/ckeditor/ckeditor5/issues/1348). */
		--ck-snippet-viewport-top-offset: 64;
	}
}

/* https://github.com/ckeditor/ckeditor5-internal/issues/3223 */
.ck-body-wrapper .ck.ck-powered-by-balloon.ck-balloon-panel.ck-balloon-panel_visible {
	display: none;
}

.ck.ck-editor {
	margin: 1.5em 0;
}

.ck.ck-content {
	padding: 1em;
}

.ck.ck-content > :first-child {
	margin-top: 0;
}

#snippet-inline-editor .ck-content {
	margin-bottom: 1rem;
	padding: 2rem;
}

/* Visually separate inline editors from example description.
https://github.com/ckeditor/ckeditor5/issues/1545 */
#snippet-inline-editor .ck-content:not(.ck-focused),
#snippet-balloon-editor.ck-content:not(.ck-focused),
#snippet-balloon-block-editor.ck-content:not(.ck-focused) {
	border: 1px solid hsla(0, 0%, 0%, 0.15);
}

#snippet-inline-editor h2,
#snippet-inline-editor h3 {
	margin-top: 0;
	padding-top: 0;
	border-bottom: 0;
}

#snippet-inline-editor header.ck-content {
	text-align: center;
}

#snippet-inline-editor header.ck-content h2 {
	font-size: 2.1rem;
}

#snippet-inline-editor header.ck-content h3 {
	color: hsla(212, 79%, 9%, 0.59);
	font-size: 1.6rem;
}