@import (reference) './variables';

.jodit-wysiwyg {
	outline: 0;

	&::selection,
	*::selection {
		background: @color-background-selection;
		color: @color-dark;
	}
}

.jodit-container:not(.jodit_inline) .jodit-wysiwyg {
	position: relative;
	padding: var(--padding-jodit-root);
	margin: 0;
	outline: 0;
	overflow-x: auto;

	img {
		display: inline;
		position: relative;
		max-width: 100%;
	}

	// It is custom tag
	jodit-media {
		position: relative;

		* {
			position: relative;
			z-index: 0;
		}

		&::before {
			position: absolute;
			z-index: 1;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			content: '';
		}
	}
}

.jodit {
	img {
		object-fit: cover;
	}

	ul {
		display: block;
		list-style-type: disc;
		margin-top: 1em;
		margin-bottom: 1em;
		margin-left: 0;
		margin-right: 0;
		padding-left: 40px;
	}

	ol {
		display: block;
		list-style-type: decimal;
		margin-top: 1em;
		margin-bottom: 1em;
		margin-left: 0;
		margin-right: 0;
		padding-left: 40px;
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		display: block;
		font-weight: bold;
		margin-top: 0;
		margin-bottom: 0;
	}

	h1 {
		font-size: 3.38em;
		font-weight: 900 !important;
		// margin-top: 0.3em;
		// margin-bottom: 0.3em;
	}

	h2 {
		font-size: 3.08em;
		font-weight: 800;
		// margin-top: 0.25em;
		// margin-bottom: 0.25em;
	}

	h3 {
		font-size: 2em;
		font-weight: 700;
		// margin-top: 0.2em;
		// margin-bottom: 0.2em;
	}

	h4 {
		font-size: 1.38em;
		font-weight: 600;
		// margin-top: 0.15em;
		// margin-bottom: 0.15em;
	}

	h5 {
		font-size: 1.23em;
		font-weight: 600;
		// margin-top: 0.1em;
		// margin-bottom: 0.1em;
	}

	h6 {
		font-size: 1.08em;
		font-weight: 600;
		// margin-top: 0.05em;
		// margin-bottom: 0.05em;
	}

	button {
		cursor: pointer;
	}
}