.wp-block-contact-form-7-contact-form-selector {
	width: 100%;
}
.wpcf7 form {
	display: grid;
	row-gap: 32px;

	& label {
		font-size: 1rem;
		font-weight: 500;
		color: var(--wp--preset--color--primary-600);

		&:has(input[type="file"]) p {
			font-size: 0.8rem;
			margin-top: 4px;
		}
	}

	& input:not([type="submit"]),
	textarea {
		width: 100%;
		margin-top: 10px;
		margin-bottom: 4px;
		padding: 10px;
		border-radius: 8px;
		border: 2px solid var(--wp--preset--color--primary-600);

		&::placeholder {
			font-size: 0.9rem;
			font-weight: 400;
		}
	}

	& input[type="file"] {
		padding: 0;

		&::file-selector-button {
			padding: 10px 12px;
			font-weight: 500;
			background: var(--wp--preset--color--primary-600);
			color: var(--wp--preset--color--primary);
			margin-right: 16px;
		}
	}

	& .wpcf7-submit-button {
		position: relative;
		display: flex;
		align-items: center;

		& input[type="submit"] {
			width: 100%;
		}

		& .wpcf7-spinner {
			position: absolute;
			right: 0;
			background: var(--wp--preset--color--primary);
			opacity: 1;

			&::before {
				background: var(--wp--preset--color--accent);
			}
		}
	}

	& .wpcf7-response-output {
		margin: 0;
		position: sticky;
		z-index: 100;
		top: 10%;
		padding: 16px 12px;
		background: color-mix(
			in hsl,
			var(--wp--preset--color--accent) 20%,
			var(--wp--preset--color--primary)
		);
		border-radius: 8px;
		border-color: color-mix(
			in hsl,
			var(--wp--preset--color--accent) 40%,
			var(--wp--preset--color--primary)
		) !important;
		color: var(--wp--preset--color--accent);
		font-weight: 500;
	}
}
