/**
 * Relatia WYSIWYG Editor Styles - Sticky Toolbar
 *
 * Makes the Trumbowyg editor toolbar sticky when scrolling
 * for easier editing in long forms.
 */

/* =========================================================================
 * Sticky Toolbar Configuration
 * ========================================================================= */

.trumbowyg-box {
	position: relative;
}

.trumbowyg-button-pane {
	position: sticky !important;
	top: 0;
	z-index: 100;
	background: #ffffff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	border-radius: 4px 4px 0 0;
}

/* Ensure toolbar stays above content when sticky */
.trumbowyg-button-pane.trumbowyg-button-pane--sticky {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Adjust editor container to account for sticky toolbar */
.trumbowyg-editor-box {
	position: relative;
}

/* =========================================================================
 * Enhanced Editor Styles
 * ========================================================================= */

/* Better visual separation */
.trumbowyg-editor {
	min-height: 200px;
	max-height: 600px;
	overflow-y: auto;
}

/* Smooth scrolling in editor */
.trumbowyg-editor {
	scroll-behavior: smooth;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
	.trumbowyg-button-pane {
		top: 0;
		position: sticky !important;
	}

	.trumbowyg-editor {
		min-height: 150px;
		max-height: 400px;
	}
}

/* Admin bar adjustment (if WordPress admin bar is present) */
body.admin-bar .trumbowyg-button-pane {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar .trumbowyg-button-pane {
		top: 46px;
	}
}