/**
 * everest-forms.scss
 * Governs the general look and feel of EverestForms sections of sites using themes that do not
 * integrate with EverestForms specifically.
 */

/**
 * Imports
 */
@import 'mixins/mixins';
@import 'variables/variables';
@import 'animation';
@import 'fonts';
@import 'clearings';

/**
 * Global styles
 */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

/**
 * Utility classes
 */
.clear {
	clear: both;
}

.everest-forms-hidden {
	display: none;
}

i.icon-wpb-vc_everest_forms {
	background-image: url('data:image/svg+xml,%3Csvg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Crect width="32" height="32" rx="4" fill="%237545BB"/%3E%3Cpath d="M24.6621 4.62549H19.1523L20.8408 7.46923H26.3506L24.6621 4.62549Z" fill="white"/%3E%3Cpath d="M28.127 10.313H22.6172L24.3945 13.1567H29.9043L28.127 10.313Z" fill="white"/%3E%3Cpath d="M28.0381 24.5318H27.2383H24.7501H7.06544L15.8633 10.1353L19.5069 16.0005H18.7071H15.8633L14.1748 18.8443H15.8633H17.0186H24.5723L15.8633 4.80322L2 27.3755H4.48828H27.2383H29.8155L28.0381 24.5318Z" fill="white"/%3E%3C/svg%3E') !important;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	width: 32px;
	height: 32px;
}

/**
 * Main EverestForms styles
 */
.everest-forms,
.wp-block-everest-forms-form-selector {
	*,
	*::before,
	*::after {
		outline: none;
		box-sizing: border-box;
	}
	ul {
		margin-left: 0;
	}
	.blockUI.blockOverlay {
		position: relative;
		@include loader();
	}

	.clear {
		height: auto;
		width: auto;
		visibility: visible;
	}

	.loader {
		@include loader();
	}

	.evf-container {
		margin-bottom: 30px;
	}

	.everest-forms-progress-bar {
		background: $color_gray-lighten;
		border-radius: 2px;

		.everest-forms-progress-bar-indicator {
			height: 4px;
			background: $green;
			border-radius: 2px;
		}
	}

	/*Everest forms uploader styles.*/
	.everest-forms-uploader {
		cursor: pointer;
		padding: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		text-align: center;
		border: 1px dashed $color_gray-light;

		span {
			display: block;
			color: $color_gray-base;

			&.everest-forms-upload-hint {
				color: $color_gray-light;
				font-size: 14px;
			}
		}

		& + input.dropzone-input {
			display: none;
		}

		.dz-message {
			flex: 0 0 100%;
			width: 100%;

			svg {
				margin-bottom: 10px;
				background: $color_gray-light-skin;
				height: 48px;
				width: 48px;
				padding: 8px;
				border-radius: 4px;
			}

			&.hide {
				display: none;
			}
		}

		.dz-preview {
			flex: 0 0 100%;
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			margin-bottom: 20px;
			border-bottom: 1px solid $color_gray-more-lighten;
			padding-bottom: 20px;

			.dz-image {
				width: 64px;
				height: 64px;
				background: $color_gray-light-skin;
				flex: 0 0 64px;
				margin-right: 15px;
				border-radius: 3px;
				overflow: hidden;
			}

			.dz-details {
				text-align: left;
				font-size: 14px;
				flex: 1;

				.dz-size {
					color: $color_gray-base;
				}

				.dz-filename {
					span {
						color: $color_gray-light;
					}
				}
			}

			.dz-progress {
				background: $color_gray-more-lighten;
				border-radius: 2px;
				height: 4px;
				width: 100%;
				margin-left: 80px;
				order: 4;

				.dz-upload {
					background-color: $green;
					border-radius: 2px;
					height: 4px;
					transition: all 0.25s ease 0s;
				}
			}

			.dz-error-message {
				font-size: 14px;
				flex: 0 0 100%;
				width: 100%;
				text-align: left;
				margin-left: 80px;
				order: 5;

				span {
					color: $red;
				}
			}

			.dz-success-mark,
			.dz-error-mark {
				display: none;
			}

			.dz-remove {
				font-size: 0;
				position: relative;
				height: 28px;
				width: 28px;
				display: inline-flex;
				margin-left: auto;
				order: 3;
				border-radius: 14px;
				border: 2px solid $color_gray-light;

				&::before,
				&::after {
					content: '';
					height: 14px;
					width: 2px;
					display: block;
					background: $color_gray-light;
					position: absolute;
					top: 50%;
					left: 0;
					right: 0;
					margin: 0 auto;
				}

				&::before {
					transform: translateY(-50%) rotate(45deg);
				}

				&::after {
					transform: translateY(-50%) rotate(-45deg);
				}
			}

			&.dz-processing {
				.dz-progress {
					display: block;
				}
			}

			&.dz-complete {
				.dz-progress {
					display: none;
				}
			}

			&.dz-error {
				.dz-remove {
					border-color: $red;

					&::before,
					&::after {
						background: $red;
					}
				}
			}

			&:last-child {
				border-bottom: 0;
				padding-bottom: 0;
				margin-bottom: 0;
			}
		}
	}

	label {
		display: block;
		line-height: 1.7;
		margin: 0 0 10px 0;
		color: $color_gray-base;
		font-size: $font_size-label;

		.required {
			color: $red;
			font-weight: 700;
			border: 0 !important;
			text-decoration: none;
		}

		&.evf-field-label {
			font-weight: 600;
		}

		&.evf-error {
			color: $red;
			font-weight: 400;
		}

		&.everest-forms-field-sublabel {
			font-size: 12px;
			font-weight: 400;
			line-height: 1.5;
			margin: 0 0 10px 0;
		}

		&.evf-privacy-policy-consent-message {
			display: inline;
			margin-bottom: 0;
		}
	}

	input[type='text'],
	input[type='date'],
	input[type='date'],
	input[type='datetime-local'],
	input[type='email'],
	input[type='file'],
	input[type='image'],
	input[type='month'],
	input[type='number'],
	input[type='password'],
	input[type='range'],
	input[type='search'],
	input[type='tel'],
	input[type='time'],
	input[type='url'],
	input[type='week'],
	select,
	textarea,
	.StripeElement,
	canvas.evf-signature-canvas {
		width: 100%;
		min-height: 38px;
		font-size: 14px;
		line-height: 20px;
		outline: none;
		box-shadow: none;
		margin-bottom: 10px;
		padding: 6px 12px;
		color: $color_gray-base;
		border: 1px solid #e1e1e1;
		border-radius: 4px;
		margin-left: 0;
		margin-right: 0;
	}
	input[type='checkbox'],
	input[type='radio'] {
		&::after,
		&::before {
			display: none;
		}
		&:checked::before {
			display: none;
		}
	}
	select {
		background-image: none;
	}
	.select2-container {
		margin-bottom: 10px;

		.select2-selection {
			&.select2-selection--single {
				height: auto;
			}

			&.select2-selection--multiple {
				.select2-selection__rendered {
					display: block;

					li {
						margin: 4px 0;

						.select2-search__field {
							padding-left: 4px;
						}
					}

					.select2-selection__choice {
						margin-right: 4px;
					}
				}
			}
		}
	}

	input,
	textarea {
		&:focus {
			outline: none;
			border: 1px solid #7545bb;
		}
	}

	.everest-form {
		&::after {
			content: '';
			clear: both;
			display: table;
		}
	}

	.everest-forms-field-row {
		&::before,
		&::after {
			content: '';
			clear: both;
			display: table;
		}

		&:last-child {
			.everest-forms-field-sublabel {
				margin-bottom: 0;
			}
		}
	}

	.evf-title-container {
		.everest-forms--title {
			font-size: 26px;
			margin: 0 0 10px 0;
		}

		.everest-forms--description {
			margin: 0 0 10px 0;
		}
	}
	.evf-field-container,
	.evf-honeypot-container,
	.evf-submit-container {
		padding-left: 15px;
		padding-right: 15px;
	}
	.evf-field-container {
		.evf-frontend-row {
			// Prevents style conflict on entries list-table.
			&:not(.wp-list-table) {
				display: flex;
				flex-wrap: wrap;
				margin-left: -15px;
				margin-right: -15px;

				select {
					appearance: menulist;
				}
			}

			.everest-forms-one-half {
				width: 48%;
				float: left;
				margin-left: 4%;

				&:first-child {
					margin-left: 0;
				}
			}

			.everest-forms-first {
				margin-left: 0;
			}

			.evf-frontend-grid {
				width: 100%;
				padding-left: 15px;
				padding-right: 15px;

				.evf-field {
					display: block;
					margin-bottom: 10px;

					&.evf-field-hidden {
						display: none;
					}

					.evf-label-hide,
					.everest-forms-sublabel-hide {
						display: none;
					}

					.validate-required {
						canvas {
							&.evf-signature-canvas {
								border-color: $red;
							}
						}
					}

					ul:not(.select2-selection__rendered) {
						margin-bottom: 10px;
						padding: 0;
						list-style: none;

						li {
							margin: 0;
							display: block;

							label,
							input {
								margin: 0;
							}

							input[type='checkbox'],
							input[type='radio'] {
								padding: 0;
								margin-top: 4px;
								margin-right: 8px;
								width: 16px;
								accent-color: #7545bb;
							}
						}
					}

					&.evf-field-title {
						h3 {
							margin: 25px 0;
							font-size: 16px;
							line-height: 1.5;
						}
					}

					&.everest-forms-invalid {
						> label {
							color: $red;
						}

						.select2-container,
						input.evf-error,
						select.evf-error,
						textarea,
						.evf-signature-canvas {
							border-color: $red;
						}

						input {
							&.evf-error {
								border-color: $red;
								~ .everest-forms-field-sublabel {
									color: $red;
								}
							}
						}
					}

					&.everest-forms-validated {
						select,
						textarea,
						input.input-text,
						.select2-container,
						.evf-signature-canvas {
							border-color: $green;
						}
					}

					::-webkit-input-placeholder {
						line-height: normal;
					}

					:-moz-placeholder {
						line-height: normal;
					}

					:-ms-input-placeholder {
						line-height: normal;
					}

					&.evf-field-radio,
					&.evf-field-checkbox,
					&.evf-field-payment-multiple,
					&.evf-field-payment-subscription-plan,
					&.evf-field-payment-checkbox {
						ul {
							li {
								display: flex;
								margin-bottom: 5px;
								flex-wrap: wrap;

								&.everest-forms-image-choices-item {
									input {
										margin-top: 0;
									}
								}
								.everest-forms-field-label-inline {
									width: calc(100% - 28px);
								}
								&.everest-forms-image-choices-item
									.everest-forms-field-label-inline {
									width: 100%;
									display: flex;
									flex-wrap: wrap;
								}
								.everest-forms-image-choices-image {
									margin-right: 10px;
								}
							}

							&.everest-forms-image-choices label {
								cursor: pointer;
							}
						}

						&.everest-forms-list-inline ul li {
							vertical-align: top;
							display: inline-flex;
							margin-right: 20px;
						}

						&.everest-forms-list-2-columns,
						&.everest-forms-list-3-columns {
							ul {
								display: flex;
								flex-wrap: wrap;
								margin-left: -15px;
								margin-right: -15px;

								li {
									width: 100%;
									padding-left: 15px;
									padding-right: 15px;

									.everest-forms-image-choices-image {
										margin-bottom: 10px;
									}
								}
							}
						}

						&.everest-forms-list-2-columns {
							@media (min-width: 768px) {
								li {
									flex: 0 0 50%;
									max-width: 50%;

									&:nth-child(1n + 3) {
										margin-top: 10px;

										@media screen and (max-width: 768px) {
											margin-top: 0;
										}
									}
								}
							}
						}

						&.everest-forms-list-3-columns {
							@media (min-width: 768px) {
								li {
									flex: 0 0 33.33333%;
									max-width: 33.33333%;

									&:nth-child(1n + 4) {
										margin-top: 10px;
									}
								}
							}
						}
					}

					&.evf-field-captcha {
						.everest-forms-captcha-equation {
							font-size: 16px;
						}

						.everest-forms-captcha-question {
							margin: 0 0 4px 0;
						}

						.everest-forms-captcha-math input {
							width: 70px;
							margin: 0 0 0 5px;
							display: inline-block;
							vertical-align: inherit;
						}
					}

					.iti {
						&.iti--allow-dropdown {
							& + .evf-error {
								margin-top: 10px;
							}
						}
					}

					.everest-forms-image-choices {
						.everest-forms-image-choices-item {
							margin-bottom: 20px !important;

							&:has(input:checked) {
								.everest-forms-field-label-inline {
									border-color: var(--wp--preset--color--vivid-cyan-blue);
									box-shadow: 0px 6px 24px 0px rgba(10, 10, 10, 0.06);
								}
							}
						}

						.everest-forms-field-label-inline {
							flex-direction: column;
							gap: 8px;
							border: 1px solid #e9e9e9;
							padding: 12px;

							br {
								display: none;
							}
						}

						input {
							&[type='radio'],
							&[type='checkbox'] {
								display: none;
							}
						}

						&-image {
							margin-right: 0 !important;

							img {
								width: 200px;
								height: 200px;
								object-fit: cover;
							}
						}
					}
				}
			}

			.evf-grid-1 {
				width: 100%;
			}

			.evf-grid-2 {
				width: 50%;
			}

			.evf-grid-3 {
				width: 33.33%;
			}

			.evf-grid-4 {
				width: 25%;
			}

			input {
				&[type='checkbox'],
				&[type='radio'] {
					box-shadow: none;
				}

				&[type='checkbox'] {
					appearance: checkbox;
				}

				&[type='radio'] {
					appearance: radio;
				}

				&[type='checkbox']:checked {
					background-color: $blue;

					&::before {
						color: $color-white;
						background-color: transparent;
					}
				}

				&[type='radio']:checked {
					&::before {
						background-color: $blue;
					}
				}

				&::placeholder {
					color: $color_gray-light;
				}
			}

			textarea {
				width: 100%;
				max-width: 100%;
				min-width: 100%;
				height: 120px;

				&::placeholder {
					color: $color_gray-light;
				}
			}

			.evf-field-description,
			.everest-forms-field-limit-text {
				line-height: 1.7;
				margin-bottom: 10px;
				font-size: $font_size-label;
			}
		}
	}

	input[type='submit'],
	button[type='submit'],
	a.button:not(.button-large),
	button.button:not(.button-large),
	.everest-forms-part-button {
		color: #555;
		height: auto;
		cursor: pointer;
		background: none;
		box-shadow: none;
		font-size: inherit;
		font-weight: 400;
		line-height: 1.5;
		padding: 10px 15px;
		border-radius: 3px;
		border: 1px solid #ccc;
		background-color: #f7f7f7;

		&:hover,
		&:active {
			outline: none;
			color: #23282d;
			background-color: #eee;
		}

		&:disabled {
			opacity: 0.5;
			cursor: not-allowed;

			&:hover {
				color: #555;
				background-color: #f7f7f7;
			}
		}
	}

	.layout-two {
		label {
			margin-bottom: 0;
		}

		.evf-field-checkbox,
		.evf-field-radio {
			label {
				margin-bottom: 20px;
			}
		}

		input,
		select,
		textarea,
		canvas.evf-signature-canvas {
			border-radius: 0;
			border-top: none transparent;
			border-right: none transparent;
			border-left: none transparent;
			border-bottom: 1px solid $color_gray-light;
			padding: 10px 0;

			&:focus {
				outline: none;
				border-top: none transparent;
				border-right: none transparent;
				border-left: none transparent;
			}
		}

		textarea {
			height: 100px;
		}
	}

	/**
	 * Notices.
	 */
	.everest-forms-notice {
		padding: 1em 3em;
		margin: 0 0 2em;
		position: relative;
		background-color: $blue;
		color: $color-white;
		border-radius: 5px;
		@include clearfix();

		&::before {
			font-family: dashicons;
			content: '\f348';
			position: absolute;
			top: 1em;
			left: 1.5em;
			color: inherit;
		}

		.button {
			float: right;
		}

		p {
			margin-bottom: 0;
		}

		a {
			color: $color-white;
		}

		li {
			list-style: none outside !important; // Required for default theme compatibility
			padding-left: 0 !important; // Required for default theme compatibility
			margin-left: 0 !important; // Required for default theme compatibility
		}

		&.everst-forms-form-disable-notice {
			color: $color_gray-base;
			background: lighten($orange, 47%);
			border: 1px solid
				adjust-color($orange, $saturation: -15%, $lightness: +20%);
		}
	}

	.everest-forms-notice--info {
		padding: 1em 1.6em;
		color: $color_gray-base;
		background: lighten($blue, 47%);
		border: 1px solid adjust-color($blue, $saturation: -15%, $lightness: +20%);

		&::before {
			visibility: hidden;
		}

		.everest-forms-notice--actions {
			margin-top: 10px;

			a.button {
				float: left;
				line-height: 1;
				cursor: pointer;
				margin-right: 7px;
				padding: 0.618em 1em;
				box-shadow: none;
				text-shadow: none;
				text-decoration: none;
				background-image: none;
				color: $color_gray-base;
				background-color: $color_gray-light-skin;

				&:focus {
					outline: none;
				}
			}
		}
	}

	.everest-forms-notice--success {
		background-color: $green;

		&::before {
			content: '\f147';
		}
	}

	.everest-forms-notice--warning {
		background-color: $orange;
	}

	.everest-forms-notice--error {
		background-color: $red;

		&::before {
			content: '\f534';
			color: inherit;
		}

		.everest-forms-notice-list {
			margin: 0;
			list-style: none outside;

			.everest-forms-notice-list__item {
				margin-bottom: 0.5em;
			}
			.everest-forms-notice-list__item:last-child {
				margin-bottom: 0;
			}
		}
	}
}

/**
 * Gutenberg Block
 */

.wp-block-everest-forms-form-selector,
.wp-block-everest-forms-frontend-listing {
	.everest-form-gutenberg-form-selector-wrap,
	.everest-form-gutenberg-form-selector-wrap {
		align-items: center;

		.components-placeholder__label {
			margin-bottom: 0;

			svg {
				width: 75px;
				height: 75px;
				color: #7e3bd0;
			}
		}

		.components-placeholder__instructions {
			color: #23282d;
			font-size: 1.3em;
			font-weight: 600;
		}

		.components-placeholder__fieldset {
			.components-base-control {
				width: 100%;
				text-align: center;
			}
		}
	}
}

div.evf-gutenberg-form-selector .evf-frontend-row input:disabled,
div.evf-gutenberg-form-selector .evf-frontend-row textarea:disabled,
div.evf-gutenberg-form-selector .evf-frontend-row select:disabled,
div.evf-gutenberg-form-selector
	.evf-frontend-row
	button[type='submit']:disabled {
	cursor: not-allowed;
}

/**
 * Anti-spam Honeypot and reCAPTCHA Area
 */
.evf-honeypot-container {
	display: none !important;
	position: absolute !important;
	left: -9000px !important;
}

.evf-recaptcha-container {
	clear: both;
	margin-bottom: 30px;

	.evf-error {
		margin-top: 15px;
		margin-bottom: 0;
		font-weight: 300;
		line-height: 1.7;
		padding: 7px 10px;
		border-radius: 3px;
		display: inline-block;
		color: darken($red, 10%);
		border: 1px solid $red;
		background-color: lighten($red, 35%);
	}

	&.recaptcha-hidden {
		margin: 0;
	}
}

/**
  * Date time design
  */
.evf-field-date-time {
	.date-time-container {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		flex-wrap: nowrap;
		margin: 0 -5px;
		@media (max-width: 767px) {
			justify-content: space-between;

			margin: 0;
		}
		input.date-dropdown-field {
			width: 100%;
			margin: 0 5px;
		}
		.date-time-space-filler {
			width: 20px;
			@media (max-width: 767px) {
				width: 100%;
			}
		}
		select {
			margin: 0 5px 0 5px;
			width: calc(100% - 66.6%);
			@media (max-width: 767px) {
				width: calc(33.33% - 10px);
				margin: 0;
			}
		}
	}
}
/* Small devices */
@media only screen and (max-width: 600px) {
	.evf-container {
		.evf-field {
			> * {
				max-width: 100%;
			}

			&:not(.evf-field-phone) {
				overflow-x: hidden;
			}

			&.evf-field,
			&.evf-field-likert {
				overflow: auto;
			}
		}
	}
}

@media screen and (min-width: 768px) {
	.everest-forms {
		.evf-field-container {
			.evf-frontend-row {
				.evf-frontend-grid {
					&.evf-grid-2 {
						flex: 0 0 50%;
						max-width: 50%;
					}
				}
			}
		}
	}
}
@media screen and (max-width: 768px) {
	.everest-forms {
		.evf-field-container {
			.evf-frontend-row {
				flex-direction: column;
				margin: 0;

				.evf-frontend-grid {
					padding: 0;

					&:last-child {
						margin-bottom: 0;
					}

					&.evf-grid-2,
					&.evf-grid-3,
					&.evf-grid-4 {
						width: 100%;
						max-width: 100%;
					}
				}
			}
		}
		.evf-recaptcha-container {
			margin: 25px 0;
		}
	}
}
.wp-admin {
	.evf-field-repeater-fields {
		display: block !important;
	}
}
/*
 * Hide the form fields upon successful submission.
 * Perhaps more robust: .everest-forms.amp-form-submit-success > *:not([submit-success]) { display:none }
 */
.amp-form-submit-success .evf-field-container,
.amp-form-submit-success .evf-submit-container {
	display: none;
}

/* For shortcode embed */

@keyframes everest-forms-heartbeat {
	0% {
		box-shadow: 0 0 0 0 rgba(140, 90, 202, 0.6);
	}
	100% {
		box-shadow: 0 0 0 10px rgba(223, 119, 57, 0);
	}
}

span.everest-forms-shortcode-form-embed-dot {
	display: inline-block;
	width: 12px;
	height: 12px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50%;
	background-color: #8c5aca;
	animation: everest-forms-heartbeat 1.5s infinite !important;
	margin: 3px 10px;
}

.wp-editor-tools span.everest-forms-shortcode-form-embed-dot {
	margin-top: 9px;
}

.everest-forms-shortcode-form-embed-theme-tooltip {
	display: none;
}

.everest-forms-shortcode-form-embed-theme.tooltipster-sidetip {
	z-index: 100100 !important;
}

.everest-forms-shortcode-form-embed-theme.tooltipster-sidetip.tooltipster-top {
	.tooltipster-box {
		margin-bottom: 18px;
	}
	.tooltipster-arrow {
		bottom: 8px;
	}
	.tooltipster-arrow-background {
		top: 0;
	}
}

.everest-forms-shortcode-form-embed-theme.tooltipster-sidetip.tooltipster-right {
	.tooltipster-box {
		margin-left: 18px;
	}
	.tooltipster-arrow {
		left: 8px;
	}
}

.everest-forms-shortcode-form-embed-theme.tooltipster-sidetip {
	.tooltipster-box {
		max-width: 260px;
		background: white;
		border: none;
		border-radius: 4px;
		box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
		-webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
		-moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
	}
	.tooltipster-box .tooltipster-content {
		color: #444444;
		padding: 16px 20px 18px;
		text-align: center;
		div *:first-child {
			margin-top: 0 !important;
		}
		h3 {
			font-size: 16px;
			letter-spacing: 0px;
			line-height: 18px;
			margin: 0;
			color: #23282c;
		}
		p {
			font-size: 14px;
			letter-spacing: 0px;
			line-height: 18px;
			margin: 10px 0 0;
			color: #444444;
		}
		a {
			color: #1d7bac;
		}
		.everest-forms-shortcode-form-embed-theme-done-btn {
			border-radius: 3px;
			cursor: pointer;
			text-decoration: none;
			text-align: center;
			vertical-align: middle;
			white-space: nowrap;
			box-shadow: none;
			font-size: 14px;
			font-weight: 600;
			letter-spacing: 0px;
			padding: 7px 18px;
			border: none;
			background-color: #8c5aca;
			color: #ffffff;
			display: block;
			margin: 15px auto 0;
			&:hover {
				background-color: #8c5aca;
			}
			&:disabled {
				cursor: default;
				opacity: 0.5;
				&:hover {
					background-color: #8c5aca;
				}
			}
		}
	}
	.tooltipster-arrow-border {
		border: none;
	}
	.tooltipster-top {
		.tooltipster-arrow-background {
			border-top-color: white;
		}
	}
	.tooltipster-right {
		.tooltipster-arrow-background {
			border-right-color: white;
		}
	}
	.tooltipster-bottom {
		.tooltipster-arrow-background {
			border-bottom-color: white;
		}
	}
}

.block-editor-page {
	.edit-post-layout {
		.components-notice-list > div {
			padding-left: 50px;
		}
	}
	.everest-forms-shortcode-form-embed-dot {
		position: absolute;
		top: 75px;
		left: 20px;
		z-index: 9999;
	}
	.everest-forms-shortcode-form-embed-theme {
		width: 260px !important;
		z-index: 99980 !important;
		margin-top: 5px;
		.tooltipster-box {
			margin-top: 10px;
		}
		.everest-forms-shortcode-form-embed-theme-tooltips-red-arrow {
			position: absolute;
			display: block;
			width: 15px;
			height: 42px;
			top: -65px;
			left: 145px;
			background-image: url(../images/icons/red-arrow.svg);
			background-size: 15px 42px;
			background-repeat: no-repeat;
		}
	}
}

.block-editor-page.is-fullscreen-mode {
	.edit-post-layout {
		.components-notice-list > div {
			padding-left: 125px;
		}
	}
	.everest-forms-shortcode-form-embed-dot {
		left: 75px;
	}
	.everest-forms-shortcode-form-embed-theme {
		.everest-forms-shortcode-form-embed-theme-tooltips-red-arrow {
			left: 105px;
		}
	}
}

// Confirmation table style.
.everest_forms_preview_confirmation_table {
	width: 100%;
	margin-top: 20px;
	border: 1px solid #ddd;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
}
.everest_forms_preview_confirmation_table_label {
	width: 100%;
	padding: 5px 10px;
	box-sizing: border-box;
	border-top: 1px solid #ddd;
	font-weight: bold;
}
.everest_forms_preview_confirmation_table_value {
	width: 100%;
	padding: 5px 10px;
	box-sizing: border-box;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
	&:first-child {
		border-left: none;
	}
}

// Confirmation Compact style.
.everest_forms_preview_confirmation_compact {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	box-sizing: border-box;

	.everest_forms_preview_confirmation_compact_label {
		flex: 0 0 30%;
		padding: 10px;
		font-weight: 600;
		box-sizing: border-box;
	}

	.everest_forms_preview_confirmation_compact_value {
		flex: 0 0 70%;
		padding: 10px;
		box-sizing: border-box;
	}

	.everest_forms_preview_confirmation_compact_label:last-child,
	.everest_forms_preview_confirmation_compact_value:last-child {
		border-bottom: none;
	}

	.everest_forms_preview_confirmation_compact_value {
		word-break: break-all;
	}
}

// Confirmation Basic style
$color_1: #333;
$background-color_1: #f9f9f9;

.everest_forms_preview_confirmation_basic {
	border: 1px solid #ddd;
	border-radius: 5px;
	padding: 20px;
	background-color: $background-color_1;
}

.everest_forms_preview_confirmation_basic_label {
	margin-bottom: 10px;
	font-weight: bold;
	display: flex;
	align-items: center;
	border-bottom: 1px solid #ddd;
	padding-bottom: 10px;

	span {
		color: $color_1;
		font-weight: 400;
		margin-left: 3px;
	}
}

.everest_forms_preview_confirmation_basic_label:last-child {
	border-bottom: none;
}

.everest-forms {
	.evf-result-feedback {
		font-size: 14px;
		border-radius: 5px;
		padding: 10px 15px;
		margin-bottom: 10px;
		display: flex;
		flex-wrap: wrap;

		&.correct_answer {
			color: $green;
			background-color: transparentize($green, 0.8);
		}

		&.incorrect_answer {
			color: $red;
			background-color: transparentize($red, 0.8);
		}
	}
}

.evf-field {
	&.evf-field-likert {
		overflow: auto;

		table {
			&.everest-forms-field-likert {
				background: #fff;
				width: 100%;
				border-radius: 3px;
				overflow: hidden;
				border-collapse: initial;
				border: 1px solid #969696;

				input,
				select {
					border-color: #adb5bd;
				}

				input {
					display: none;
				}

				label {
					height: 17px;
					width: 17px;
					margin: 0 auto;
					cursor: pointer;
					position: relative;
					display: flex;
					align-items: center;
					justify-content: center;

					span {
						display: none;
					}

					&::before {
						height: 17px;
						width: 17px;
						content: '';
						border: 1px solid #adb5bd;
						transition: all 0.25s ease 0s;
					}

					&:hover {
						&::before {
							border: 1px solid darken(#adb5bd, 25%);
						}
					}
				}

				input {
					&[type='radio'] {
						+ label {
							&::before {
								border-radius: 50%;
							}
						}
					}

					&[type='checkbox'],
					&[type='radio'] {
						+ label {
							&::after {
								content: '';
								position: absolute;
								height: 5px;
								width: 9px;
								border-left: 2px solid transparent;
								border-bottom: 2px solid transparent;
								transform: rotate(-45deg);
								margin-bottom: 0;
							}
						}

						&:checked {
							+ label {
								&::before {
									background: darken(#adb5bd, 25%);
									border-color: darken(#adb5bd, 25%);
								}

								&::after {
									border-color: #fff;
								}
							}
						}

						&.evf-error {
							+ label {
								&::before {
									border-color: $red;
								}
							}
						}
					}
				}

				select {
					height: 25px;
					width: 100px;
					padding: 0 5px;

					+ label {
						display: none;
					}
				}

				th,
				td {
					border: none;
					padding: 10px;
					height: 42px;
					word-break: normal;
				}

				th {
					font-size: 14px;
					font-weight: 400;
					text-align: center;
				}

				thead {
					th {
						background: #f6f7f8;
						border-bottom: 1px solid #ced4da;
					}
				}

				tbody {
					tr {
						text-align: left;

						th {
							text-align: left;

							label.evf-error {
								height: auto;
								width: auto;
								display: block;
								border: none;
								padding: 0;
								background: no-repeat;
								margin-left: 0;

								&::before {
									content: none;
								}
							}
						}

						td {
							text-align: center;

							&:last-child {
								border-right: none;
							}
						}

						&:nth-child(even) {
							th,
							td {
								background: #f6f7f8;
							}
						}
					}
				}
			}
		}
	}

	&.evf-field-scale-rating {
		overflow: auto;

		table {
			&.everest-forms-field-scale-rating {
				width: 100%;
				border: none;
				margin-bottom: 10px;
				overflow: hidden;
				border-collapse: inherit;

				input {
					display: none;

					&[type='radio'] {
						&:hover,
						&:checked {
							+ label {
								background: darken(#f6f7f8, 10%);
								border: 3px solid darken(#adb5bd, 25%);
							}
						}
					}
				}

				label {
					background: #f6f7f8;
					height: 42px;
					min-width: 40px;
					margin-bottom: 0;
					transition: all 0.2s ease 0s;
					border: 3px solid transparent;
					display: flex;
					align-items: center;
					justify-content: center;
				}

				td,
				th {
					border: none;
				}

				thead {
					tr {
						th {
							font-size: 12px;
							font-weight: 400;
							padding: 0 0 10px;

							.lowest-rating {
								float: left;
							}

							.highest-rating {
								float: right;
							}
						}
					}
				}

				tbody {
					tr {
						td {
							padding: 0;
							border-right: none;
							text-align: center;
							border: 1px solid #d5d9e2;
							border-right: none;
							line-height: 36px;

							&:last-child {
								border-right: 1px solid #d5d9e2;
							}
						}
					}
				}
			}
		}
	}
}

/**
 * Quiz and Polls Result.
**/
.everest-forms-notice--report {
	padding: 25px;
	margin-bottom: 2rem;
	border-radius: 5px;
	border: 1px solid $color_gray-lighten;
	background-color: lighten($color_gray-more-lighten, 2%);

	.evf-result-box {
		border-radius: 5px;
		background: $color-white;
		color: $color_gray-base;
		margin-bottom: 25px;
		padding: 15px 20px;

		&:last-child {
			margin-bottom: 0;
		}

		ul {
			margin: 0;
			padding: 0;
			list-style: none;

			li {
				display: flex;
				align-items: center;
				margin-bottom: 5px;

				input {
					&[type='radio'],
					&[type='checkbox'] {
						margin-right: 10px;
					}
				}

				&.correct_answer {
					color: $green;
				}

				&.incorrect_answer {
					color: $red;
				}
			}
		}

		.evf-result-title {
			font-size: 18px;
			font-weight: 600;
			margin-bottom: 5px;
		}

		.evf-result-answers {
			font-size: 14px;
			margin-bottom: 10px;

			.evf-result-label-wrap {
				display: flex;
				align-items: center;
				justify-content: space-between;
			}

			.evf-poll-answer-progressbar {
				display: flex;
				height: 15px;
				overflow: hidden;
				background-color: $color_gray-more-lighten;
				border-radius: 3px;

				.evf-poll-answer-active-progressbar {
					display: flex;
					flex-direction: column;
					justify-content: center;
					color: #fff;
					text-align: center;
					white-space: nowrap;
					background-color: #007bff;
					transition: width 0.6s ease;
				}
			}
		}

		.evf-poll-answer-summary {
			display: flex;
			font-size: 18px;
			margin-top: 20px;
			margin-left: -20px;
			margin-right: -20px;
			border-top: 1px solid $color_gray-lighten;

			.evf-total-answers-wrap,
			.evf-skipped-answers-wrap {
				font-weight: 600;
				padding: 15px 20px;
				margin-bottom: -15px;
				display: flex;
				flex: 1;
				justify-content: space-between;
			}

			.evf-total-answers-wrap {
				border-right: 1px solid $color_gray-lighten;
			}
		}

		&.evf-quiz-result {
			.evf-quiz-title-wrap {
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				font-size: 18px;
				font-weight: 600;

				.evf-result-title,
				.evf-result-marks {
					flex: 1;
				}

				.evf-result-marks {
					text-align: right;
				}
			}
		}
	}
}

//Like dislike

.everest-forms-field-yes-no-container {
	.everest-forms-field-yes-no {
		display: inline-flex;
		margin-right: 30px;

		.input-text {
			display: none;
		}

		svg {
			height: 32px;
			width: 32px;
			opacity: 0.5;
			stroke-width: 0.6px;
			stroke: rgba(0, 0, 0, 0.65);
			transition: all 0.5s ease-in-out;

			&:hover {
				cursor: pointer;
				opacity: 1;
			}
		}

		label {
			margin: 0;

			&:hover {
				cursor: pointer;
			}
		}

		&.active {
			svg {
				opacity: 1;
				animation: wiggle 2s linear;
			}
		}
	}
}
.everest-forms-field-rating-container {
	input[type='radio'] {
		display: none;
	}

	label {
		display: inline-block;
		margin-right: 10px;
	}

	.everest-forms-field-rating {
		transition: all 0.25s ease 0s;

		svg {
			transition: all 0.25s ease 0s;
			opacity: 0.6;
		}

		&.hover,
		&.selected {
			transform: scale(1.25);

			svg {
				opacity: 1;
			}
		}
	}
}
//Like dislike text only

.evf-yes-no-field-with-text {
	.everest-forms-field-yes-no-container {
		display: flex;

		.everest-forms-field-yes-no {
			padding: 8px 32px;
			border: 1px solid;
			border-radius: 4px;

			&:hover {
				cursor: pointer;
			}

			&.yes {
				border-color: #008000;

				&:hover {
					background-color: #eeffee;
					transition: 0.2s ease-in-out;
				}
			}

			&.no {
				border-color: #ff0000;

				&:hover {
					background-color: #fff1f1;
					transition: 0.2s ease-in-out;
				}
			}

			&.active {
				&.yes {
					background-color: #eeffee;
					transition: 0.5s ease-in-out;
					animation: shrinkgrow 0.2s linear;

					label {
						color: #008000;
					}
				}

				&.no {
					background-color: #fff1f1;
					transition: 0.5s ease-in-out;
					animation: shrinkgrow 0.2s linear;

					label {
						color: #ff0000;
					}
				}
			}
		}
	}
}

//Like dislike text and icon

.evf-yes-no-field-with-icon-text {
	.everest-forms-field-yes-no-container {
		.everest-forms-field-yes-no {
			display: inline-flex;
			justify-content: center;
			align-items: center;
			column-gap: 8px;
		}
	}
}

//Animations for like dislike button

@keyframes wiggle {
	0% {
		transform: rotateZ(0);
	}
	15% {
		transform: rotateZ(-15deg);
	}
	20% {
		transform: rotateZ(10deg);
	}
	25% {
		transform: rotateZ(-10deg);
	}
	30% {
		transform: rotateZ(6deg);
	}
	35% {
		transform: rotateZ(-4deg);
	}
	100% {
		transform: rotateZ(0);
	}
}

@keyframes shrinkgrow {
	0% {
		transform: scale(0.9);
	}

	100% {
		transform: scale(1);
	}
}

.evf-td-head {
	background: #f6f7f8;
	border-bottom: 1px solid #ced4da !important;
}

/** CSS for Beaver builder*/
.everest-forms-beaver__container {
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: center;

	img.everest-forms-logo__beaver {
		background: #7545bb;
		padding: 1rem;
		border-radius: 14px;
	}
}
.et-db {
	#et-boc {
		.et-l {
			.et-fb-modules-list {
				ul {
					> li.everest_forms_divi_builder {
						&:before {
							content: '';
							background-image: url('data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.4553%202.87459H12.0039L13.0616%204.65593H16.513L15.4553%202.87459Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M17.6262%206.43721H14.1748L15.2882%208.21856H18.7395L17.6262%206.43721Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M17.5703%2015.3441H17.0693H15.5106H4.4328L9.94387%206.32597L12.2262%2010H11.7252H9.94387L8.88619%2011.7814H9.94387H10.6675H15.3993L9.94387%202.98592L1.25977%2017.1254H2.81845H17.0693H18.6836L17.5703%2015.3441Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E');
							height: 16px;
							background-repeat: no-repeat;
							background-position: center;
							filter: invert(47%) sepia(92%) saturate(2271%) hue-rotate(187deg)
								brightness(91%) contrast(86%);
						}
					}
				}
			}
		}
	}
}

body .everest-forms-popup-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;

	.everest-forms-popup {
		background: #fff;
		padding: 20px 30px;
		border-radius: 8px;
		width: 386px;
		height: 278px;
		text-align: center;
		position: relative;
		box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);

		img.everest-forms-popup-success-logo {
			margin-top: 54px;
			margin-bottom: 24px;
		}

		p.everest-forms-popup-success-text {
			font-size: 24px;
			font-weight: 500;
		}

		p {
			font-size: 15px;
			font-weight: 400;
			margin: 0;
		}
	}

	.everest-forms-popup-close {
		position: absolute;
		top: 10px;
		right: 15px;
		font-size: 20px;
		font-weight: bold;
		color: #aaa;
		cursor: pointer;
		transition: color 0.3s;
		margin-top: 24px;
		margin-right: 24px;
	}
}
.everest-forms-modal {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 99999999;
	&::after {
		content: '';
		position: absolute;
		background-color: #0000005b;
		inset: 0;
		z-index: 1;
	}
	.evf-model {
		display: flex;
		flex-direction: column;
		gap: 8px;
		overflow-y: auto;
		padding: 24px;
		border-radius: 8px;
		box-shadow: 2px 6px 32px 0 #00000020;
		position: relative;
		background-color: #fff;
		z-index: 999;
		transition: scrollbar 0.5s ease-out;
		animation: MoveIn 0.5s ease-in-out;
		&::-webkit-scrollbar {
			width: 10px;
		}
		&::-webkit-scrollbar-track {
			width: 20px;
			background-color: #fff;
			border-radius: 8px;
		}
		&::-webkit-scrollbar-thumb {
			display: none;
			border-radius: 8px;
			width: 10px;
			border: 5px solid #d5d5d5;
			background-clip: content-box;
		}
		&:hover::-webkit-scrollbar-thumb {
			display: block;
		}
		.evf-close-popup {
			text-decoration: none;
			line-height: 20px;
			color: #a7a7a7;
			cursor: pointer;
			font-size: 28px;
			font-weight: 600;
			position: absolute;
			right: 16px;
			top: 14px;
			transition: all 0.3s ease-in-out;
			z-index: 99999;
			&:hover {
				color: #ff6a6a;
			}
		}
		.header-wrap,
		.footer-wrap {
			justify-items: center;
			.title {
				margin: 0px 0px 12px 0px;
				font-weight: 500;
				font-size: 30px;
				line-height: 40px;
				width: 100%;
				text-align: center;
				color: #222222;
			}
			.desc {
				font-size: 16px;
				line-height: 24px;
				color: #494d50;
			}
		}
		.everest-forms {
			margin-top: 30px;
			margin-bottom: 30px;
			.evf-container.default {
				margin-bottom: 0;
				.everest-form {
					.evf-submit-container {
						margin: 24px 0 0 0;
					}
				}
			}
		}
		&.evf-default {
			min-width: 45vw;
			height: 70vh;
		}
		&.evf-medium {
			min-width: 55vw;
			height: 70vh;
		}
		&.evf-large {
			min-width: 65vw;
			height: 70vh;
		}
	}
}

.evf-popup-type-premium-label {
	position: relative;
	display: inline-block;
	padding-right: 20px; /* make room for the icon */
}

.evf-popup-type-premium-label::before {
	content: '';
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxMiAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMC42ODc1IiB5PSIxLjE4NzUiIHdpZHRoPSIxMC42MjUiIGhlaWdodD0iMTAuNjI1IiByeD0iMS41NjI1IiBmaWxsPSIjNzU0NUJCIiBzdHJva2U9IiM3NTQ1QkIiIHN0cm9rZS13aWR0aD0iMC42MjUiLz4KPHBhdGggZD0iTTYuMDAwMjggMy43MjE5NUw3LjY2Njk1IDguMTY2NEg0LjMzMzYyTDYuMDAwMjggMy43MjE5NVoiIGZpbGw9IiNFRkVGRUYiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkZCIgY2xpcC1ydWxlPSJldmVub2RkZCIgZD0iTTMuMjIyNTMgNC44MzMwNkwzLjYxOTM2IDguMTY2M0g4LjM4MTI2TDguNzc4MDkgNC44MzMwNkw2LjAwMDMxIDcuMTI0NzNMMy4yMjI1MyA0LjgzMzA2Wk04LjM4MTIzIDguNDgzODVIMy42MTkzMlY5LjI3NzVIOC4zODEyM1Y4LjQ4Mzg1WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	position: absolute;
	width: 16px;
	height: 16px;
	top: 0;
	right: 0;
}
