/* Generals */
.editor-styles-wrapper, .wp-site-blocks {
	overflow-x: hidden;
	box-sizing: border-box;
	ul, ol {
		box-sizing: inherit;
		margin-top: 0;
		margin-bottom: 1rem;
	}

	input::-webkit-outer-spin-button,
	input::-webkit-inner-spin-button {
	    -webkit-appearance: none;
	}
}
.elementor-editor-active .editor-styles-wrapper {
	overflow: visible;
}
.wp-block {
	margin-top: 0;
	margin-bottom: 0;
}
:is(.is-layout-flow,.is-layout-constrained,.is-layout-constrained>.wp-block-group__inner-container)>* {
	margin-block: 0 var(--porto-block-spacing);
}

html .editor-styles-wrapper,
html .wp-site-blocks {
	font: var(--porto-body-fst, normal) var(--porto-body-fw, 400) var(--porto-body-fs, 14px)/var(--porto-body-lh, 1.7142) var(--porto-body-ff), sans-serif;
	letter-spacing: var(--porto-body-ls, normal);
	color: var(--porto-body-color, #777);
	padding-left: 20px;
	padding-right: 20px;
}

.editor-styles-wrapper,
.wp-site-blocks {
	h1, h2, h3, h4, h5, h6 {
		margin-top: 0;
		margin-bottom: 1rem
	}
} 

.editor-styles-wrapper {
	max-width: var(--porto-g-editor-w, 100%);
	transition: max-width .2s;
}

.editor-styles-wrapper h1,
body .wp-site-blocks h1 {
	font: var(--porto-h1-fs, 36px)/var(--porto-h1-lh, 1.4) var(--porto-h1-ff, var(--porto-body-ff)), sans-serif;
	font-weight: var(--porto-h1-fw, 700);
	color: var(--porto-h1-color, #222529);
}
.editor-styles-wrapper h2,
body .wp-site-blocks h2 {
	font: var(--porto-h2-fs, 36px)/var(--porto-h2-lh, 1.4) var(--porto-h2-ff, var(--porto-body-ff)), sans-serif;
	font-weight: var(--porto-h2-fw, 700);
	color: var(--porto-h2-color, #222529);
}
.editor-styles-wrapper h3,
body .wp-site-blocks h3 {
	font: var(--porto-h3-fs, 36px)/var(--porto-h3-lh, 1.4) var(--porto-h3-ff, var(--porto-body-ff)), sans-serif;
	font-weight: var(--porto-h3-fw, 700);
	color: var(--porto-h3-color, #222529);
}
.editor-styles-wrapper h4,
body .wp-site-blocks h4 {
	font: var(--porto-h4-fs, 36px)/var(--porto-h4-lh, 1.4) var(--porto-h4-ff, var(--porto-body-ff)), sans-serif;
	font-weight: var(--porto-h4-fw, 700);
	color: var(--porto-h4-color, #222529);
}
.editor-styles-wrapper h5,
body .wp-site-blocks h5 {
	font: var(--porto-h5-fs, 36px)/var(--porto-h5-lh, 1.4) var(--porto-h5-ff, var(--porto-body-ff)), sans-serif;
	font-weight: var(--porto-h5-fw, 700);
	color: var(--porto-h5-color, #222529);
}
.editor-styles-wrapper h6,
body .wp-site-blocks h6 {
	font: var(--porto-h6-fs, 36px)/var(--porto-h6-lh, 1.4) var(--porto-h6-ff, var(--porto-body-ff)), sans-serif;
	font-weight: var(--porto-h6-fw, 700);
	color: var(--porto-h6-color, #222529);
}
.editor-styles-wrapper p,
.wp-site-blocks p {
	margin-top: 0;
	margin-bottom: 1.25rem
}

.editor-styles-wrapper .porto-sicon-title {
	margin: 3px 0;
}

.porto-column, .pricing-table-classic.spaced [class*="col-lg-"], .grid-creative > .post, .vc_section {
	padding-left: var(--porto-column-spacing, 10px);
	padding-right: var(--porto-column-spacing, 10px);
}

.porto-empty-block-placeholder {
	background: #f4f4f4;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 5px;
	padding: 4px 8px;
	color: #888;
}

/* elementor compatibility */
// .elementor-editor-inactive.svg svg:not(.components-spinner) {
// 	width: auto;
// 	height: auto;
// }
.elementor-editor-inactive.svg .DayPickerNavigation_svg__horizontal {
	width: 19px;
	height: 19px
}

/* colors */
.background-color-primary { background-color: var(--porto-primary-color) !important }
.background-color-secondary { background-color: var(--porto-secondary-color) !important }
.background-color-tertiary { background-color: var(--porto-tertiary-color) !important }
.background-color-quaternary { background-color: var(--porto-quaternary-color) !important }
.background-color-dark { background-color: var(--porto-dark-color) !important }
.background-color-light { background-color: var(--porto-light-color) !important }

.text-color-primary, .heading-primary { color: var(--porto-primary-color) !important }
.text-color-secondary, .heading-secondary { color: var(--porto-secondary-color) !important }
.text-color-tertiary, .heading-tertiary { color: var(--porto-tertiary-color) !important }
.text-color-quaternary { color: var(--porto-quaternary-color) !important }
.text-color-dark, .heading-dark { color: var(--porto-dark-color) !important }
.text-color-light, .heading-light { color: var(--porto-light-color) !important }

.editor-styles-wrapper a, .wp-site-blocks a { color: var(--porto-primary-color); text-decoration: none; pointer-events: none; }
.editor-styles-wrapper .iris-palette, .wp-site-blocks .iris-palette { pointer-events: auto }

