@use '../../../../design/scss/_variables.scss' as *;

.adpresso-gutenberg-editor {
	border: 1px solid $color-divider;
	border-radius: $radius-sm;
	margin-top: $space-3;
}

.adpresso-editor-header {
	display: flex;
	align-items: center;
	padding: $space-2 $space-3;
	border-bottom: 0.12em solid $color-divider;
	background-color: #f6f7f7;
}

.adpresso-editor-body {
	display: flex;
	// Stellt sicher, dass der Container eine Mindesthöhe hat
	min-height: 350px;
}

.adpresso-editor-content {
	flex-grow: 1; // Der Schreibbereich nimmt den meisten Platz ein
	padding: $space-4;
}

.adpresso-editor-sidebar {
	flex-shrink: 0; // Verhindert, dass die Seitenleiste schrumpft
	width: 280px;   // Standardbreite der Gutenberg-Sidebar
	border-left: 1px solid $color-divider;
	background-color: $color-white;
	// Sorgt für vertikales Scrolling, falls nötig
	overflow-y: auto;
}

// Kleinere Fixes für die WordPress-Komponenten in unserem Kontext
.adpresso-gutenberg-editor {
	.components-popover {
		z-index: 100000; // Stellt sicher, dass Popups über dem Modal liegen
	}
}

.adpresso-html-editor-field {
	display: flex;
	flex-direction: column;
	gap: 1em;
	margin-top: -.8em;

	.adpresso-editor-content-wrapper {
		font-size: $font-size;

		.adpresso-classic-editor-textarea {
			width: 100%;
		}
	}
}