:root {
	--form-label-colour: var(--wp--preset--color--body);
	--form-input-colour: var(--wp--preset--color--base);
	--form-input-text-colour: var(--wp--preset--color--body);
	--form-placeholder-colour: var(--wp--preset--color--mid-grey);
	--form-select-hover-colour: var(--wp--preset--color--light-grey);
	--select-arrow: url(../../icons/chevron-down.svg);
}

.has-body-background-color {
	--form-label-colour: var(--wp--preset--color--base);
	--form-input-colour: var(--wp--preset--color--dark-grey);
	--form-input-text-colour: var(--wp--preset--color--base);
	--form-placeholder-colour: var(--wp--preset--color--mid-grey);
	--form-select-hover-colour: var(--wp--preset--color--dark-grey);
	--select-arrow: url(../../icons/chevron-down-light.svg);
}

/* Forminator */

.forminator-edit-module {
	display: none;
}

body form .forminator-button:hover {
	box-shadow: none!important;
}

.forminator-guttenberg {
	margin-top: 0;
}

.forminator-field {
	display: flex;
	flex-direction: column;

	textarea,
	input,
	select {
		width: 100%;
    	padding: 12px;
    	background-color: var(--form-input-colour);
    	border: none;
    	/* border: 1px solid var(--wp--preset--color--body); */
    	border-radius: 12px;
    	color: var(--form-input-text-colour);
    	&::placeholder {
    		color: var(--form-placeholder-colour);
    	}
	}

	select {
		appearance: none;

		@supports(appearance: base-select) {
			&, &::picker(select) {
				appearance: base-select;
			}
		}

		background-image: var(--select-arrow);
		background-repeat: no-repeat;
		background-position: right 16px top 50%;
		background-size: 0.75rem;

		&::picker-icon {
			display: none;
		}

		option {
			padding-block: 8px;

			background-color: #333333;
			color: #fff;

			&[disabled] {
				color: #CCCCCC;
			}

			&:hover, &:focus {
				background-color: #CCCCCC;
				color: #333;
			}

			&:first-of-type {
				border-top-left-radius: 12px;
				border-top-right-radius: 12px;
			}
			
			&:last-of-type {
				border-bottom-left-radius: 12px;
				border-bottom-right-radius: 12px;
			}
		}
	}

	::picker(select) {
		background: transparent;
	}

	label {
	    margin-bottom: 4px;
	    font-size: 24px;
	    font-weight: 500;
	    color: var(--form-label-colour);
	}
}

.forminator-row-last {
/*	margin-top: 24px;*/
	margin-bottom: 0!important;
	.forminator-field {
/*		margin-top: 0;*/
    	align-items: flex-start;
	}
}

.forminator-field-name > .forminator-row {
	gap: 0;
}

.entry-content ul.forminator-uploaded-files {
	list-style: none;
	padding: 0;

	li:not(:last-child) {
		margin-bottom: var(--bl);
	}

	.forminator-uploaded-file--content {
		display: flex;
		align-items: center;
		gap: var(--bl);
	}

	.forminator-uploaded-file--image {
		display: none;
	}

	.forminator-uploaded-file--text {
		display: flex;
		flex-direction: column;
		gap: 0;

		p {
			margin: 0;
			font-size: 15px;
		}
	}

	button.forminator-uploaded-file--delete {
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		border: none;
		background-color: var(--wp--preset--color--accent);
		padding: 10px;
		border-radius: 4px;

		.forminator-icon-close {
			display: flex;

			&::before {
				color: white;
			}
		}
	}
}

.forminator-error {
	display: none;
}

.forminator-required {
	color: #E04562;
}

.forminator-success,
.forminator-response-message,
.forminator-error-message {
	padding: 6px;
	margin: 0;
	margin-top: 2px;
	font-size: 12px;
	line-height: 1;
	background-color: #F9E4E8;
	color: #E04562;
}

.forminator-response-message {
	margin: 0;
	padding: 12px 16px;
	margin-bottom: 12px;
	background-color: var(--wp--preset--color--accent-2);
	color: var(--wp--preset--color--base);
	ul {
		padding: 0;
		list-style: none;
		margin: 0;
	}

	p {
		margin: 0;
		padding: 0;
	}
}

.forminator-success {
	background-color: #d6fbdc;
	color: green;
	margin: 0;
	padding: 12px;
	margin-bottom: 12px;
}

.forminator-field-captcha {
	margin-top: var(--col-gap);
}