// Form.
.elementor-widget-form {
	// Base Theme Widget Styles.
	&.vamtam-has-theme-widget-styles {
		.flatpickr-mobile {
			&:is([type=date],[type=time]) {
				-webkit-appearance: initial;
			}
		}

		.elementor-field-type-radio.elementor-field-group {
			>.elementor-field-subgroup.elementor-subgroup-inline {
				justify-content: center;
				flex-wrap: nowrap;
			}
		}
		form.elementor-form {
			.elementor-field-type-step {
				.elementor-subgroup-inline {
					input[type=checkbox] {
						display: none;
						&+label {
							display: inline-block;
							margin-bottom: 15px;
							border-radius: 40px;
							padding: 20px;
							width: 100%;
							text-align: center;
							font-weight: 600;
							border: solid 2px var(--vamtam-accent-color-2);
							transition: all 0.3s ease;
							&:hover {
								background: var(--vamtam-accent-color-1);
								border-color: var(--vamtam-accent-color-1);
								color: var(--vamtam-accent-color-5);
							}
						}
						&:checked {
							&+label {
								background: var(--vamtam-accent-color-1);
								border-color: var(--vamtam-accent-color-1);
								color: var(--vamtam-accent-color-5);
							}
						}
					}
					input[type=radio] {
						display: none;
						&+label {
							display: inline-block;
							margin-bottom: 15px;
							border-radius: 40px;
							padding: 20px;
							width: 100%;
							text-align: center;
							font-weight: 600;
							border: solid 2px var(--vamtam-accent-color-2);
							transition: all 0.3s ease;
							&:hover {
								background: var(--vamtam-accent-color-1);
								border-color: var(--vamtam-accent-color-1);
								color: var(--vamtam-accent-color-5);
							}
						}
						&:checked {
							&+label {
								background: var(--vamtam-accent-color-1);
								border-color: var(--vamtam-accent-color-1);
								color: var(--vamtam-accent-color-5);
							}
						}
					}
				}
				.elementor-field-type-html {
					h3 {
						margin-bottom: 3px;
					}
				}
			}

			.elementor-field-group {
				.elementor-field-label {
					padding-left: 0;
					padding-right: 0;
				}

				.elementor-select-wrapper:before {
					text-shadow: none;
				}
			}

			.elementor-button .elementor-form-spinner {
				font-size: 16px;
			}
		}
		.elementor-field-type-checkbox {
			.elementor-field-subgroup.elementor-subgroup-inline {
				display: grid;
				grid-template-columns: repeat(3,1fr);
				grid-auto-rows: 1fr;
				justify-content: center;
				align-items: flex-start;
				flex-wrap: nowrap;
			}
		}
		.elementor-animation-vamtam-marquee {
			@keyframes vamtam-marquee {
				0% {
					transform: translateX(0)
				}

				to {
					transform: translateX(var(--vamtam-bw, calc(110% + 2.1em)));
				}
			}

			&.elementor-button {
				overflow: hidden;

				.elementor-button-text {
					transition: all .3s cubic-bezier(0, .5, .5, 1);
					transform: translateX(0);
					will-change: transform, opacity;

					&::before {
						opacity: 0;
						content: attr(data-content);
						display: flex;
						align-items: center;
						justify-content: center;
						position: absolute;
						left: 0;
						top: 0;
						width: 100%;
						height: 100%;
    					transform: translateX(calc(var(--vamtam-bw, calc(-110% - 2.1em)) * -1));
						transition: all .3s cubic-bezier(0, .5, .5, 1);
						z-index: 1;
						will-change: transform, opacity;
					}

				}

			}

			&:hover .elementor-button-text {
				animation: vamtam-marquee 2.3s linear infinite;
				&::before {
					opacity: 1;
				}
			}
		}

		&.vamtam-booking-form {
			.e-form__indicators__indicator.e-form__indicators__indicator--state-inactive .e-form__indicators__indicator__label {
				color: var( --vamtam-accent-color-7);
			}

			.e-form__indicators {
				display: block;
				border-top: 1px solid;
				border-bottom: 1px solid;
				border-color: var( --vamtam-accent-color-7);
				padding: 10px 0;

				.e-form__indicators__indicator {
					display: inline-block;
					width: 50%;
				}

				.e-form__indicators__indicator__separator {
					display: none;
				}

				.e-form__indicators__indicator__number {
					display: inline;
					margin-right: 5px;
				}
			}

			.e-form__indicators__indicator:last-of-type {
				text-align: end;
			}

			.elementor-field-group.e-form__buttons__wrapper.elementor-field-type-previous {
				display: none !important;
			}

			.elementor-field-group.elementor-field-type-submit {
				width: 100%;
			}
		}

		// File upload.
		input[type="file"] {
			width: 100%;
			background-color: var( --vamtam-accent-color-3);
			border-bottom: none !important;
			color: transparent !important;
			position: relative;
			height: 50px;

			background-image: repeating-linear-gradient(-37deg, var( --vamtam-accent-color-1), var( --vamtam-accent-color-1) 6px, transparent 6px, transparent 12px, var( --vamtam-accent-color-1) 12px), repeating-linear-gradient(53deg, var( --vamtam-accent-color-1), var( --vamtam-accent-color-1) 6px, transparent 6px, transparent 12px, var( --vamtam-accent-color-1) 12px), repeating-linear-gradient(143deg, var( --vamtam-accent-color-1), var( --vamtam-accent-color-1) 6px, transparent 6px, transparent 12px, var( --vamtam-accent-color-1) 12px), repeating-linear-gradient(233deg, var( --vamtam-accent-color-1), var( --vamtam-accent-color-1) 6px, transparent 6px, transparent 12px, var( --vamtam-accent-color-1) 12px);
			background-size: 1px 100%, 100% 1px, 1px 100%, 100% 1px;
			background-position: 0 0, 0 0, 100% 0, 0 100%;
			background-repeat: no-repeat;

			&::file-selector-button {
				border: none;
				color: var( --vamtam-accent-color-1);
				background-color: var( --vamtam-accent-color-3);
				transform: translateY(20%);
				position: absolute;
				left: 40px;
				top: 0;
				width: calc(100% - 80px);
				height: 35px !important;
			}
		}

		form.elementor-form select.elementor-field-textual {
			padding: 5px 0px;
		}

		.elementor-field-group .elementor-select-wrapper::before {
			font-family: 'theme-icons' !important;
			content: "\e90e";
			font-size: 17px;
			right: 0;
		}

		// links inside form labels to inherit styles from label instead of global kit link selector
		label a {
			font: inherit;
			color: inherit;
			text-transform: inherit;
		}
	}
}

.flatpickr-calendar {
	.flatpickr-month {
		padding-bottom: 20px;
		.cur-year {
			border: none !important;
			border-radius: 0 !important;
			font-size: inherit !important;
		}
	}
}
.flatpickr-day.today {
	border-color: var(--vamtam-accent-color-6) !important;
	&:hover {
		background: var(--vamtam-accent-color-6) !important;
		border-color: var(--vamtam-accent-color-6) !important;
	}
	&:focus {
		background: var(--vamtam-accent-color-6) !important;
		border-color: var(--vamtam-accent-color-6) !important;
	}
}
.flatpickr-day.selected {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
	&:focus {
		background: var(--vamtam-accent-color-1) !important;
		border-color: var(--vamtam-accent-color-1) !important;
	}
	&:hover {
		background: var(--vamtam-accent-color-1) !important;
		border-color: var(--vamtam-accent-color-1) !important;
	}
}
.flatpickr-day.startRange {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
	&:focus {
		background: var(--vamtam-accent-color-1) !important;
		border-color: var(--vamtam-accent-color-1) !important;
	}
	&:hover {
		background: var(--vamtam-accent-color-1) !important;
		border-color: var(--vamtam-accent-color-1) !important;
	}
}
.flatpickr-day.endRange {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
	&:focus {
		background: var(--vamtam-accent-color-1) !important;
		border-color: var(--vamtam-accent-color-1) !important;
	}
	&:hover {
		background: var(--vamtam-accent-color-1) !important;
		border-color: var(--vamtam-accent-color-1) !important;
	}
}
.flatpickr-day.selected.inRange {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.startRange.inRange {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.endRange.inRange {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.selected.prevMonthDay {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.startRange.prevMonthDay {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.endRange.prevMonthDay {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.selected.nextMonthDay {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.startRange.nextMonthDay {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
.flatpickr-day.endRange.nextMonthDay {
	background: var(--vamtam-accent-color-1) !important;
	border-color: var(--vamtam-accent-color-1) !important;
}
