/* ============================================================
   CONTACT FORM 7  –  classe wrapper .wc-cf7
   ============================================================ */

.wc-cf7 {
	display: flex;
	flex-direction: column;
	gap: var(--s-sm);

	& .wpcf7-form-control-wrap {
		display: block;
	}

	& input[type="text"],
	& input[type="email"],
	& input[type="tel"],
	& select,
	& textarea {
		width: 100%;
		box-sizing: border-box;
		min-height: 2.75rem;        /* 44px – cible tactile (sauf textarea, géré plus bas) */
		padding: var(--s-sm) var(--s-md);
		background: var(--c-cream-200);
		border: 1px solid var(--c-cream-900);
		border-radius: var(--br-sm);
		font-size: 0.875rem;
		color: var(--c-text);
		font-family: inherit;
		transition: border-color var(--tr-base), box-shadow var(--tr-base);
		outline: none !important;
		appearance: none;
		-webkit-appearance: none;

		&:focus {
			border-color: var(--c-primary);
			box-shadow: 0 0 0 3px rgba(133, 147, 66, 0.15);
		}
	}

	& input::placeholder,
	& textarea::placeholder {
		color: #b89f82;
	}

	& select {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235a2f15' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: right 14px center;
		padding-right: 2.25rem;
		cursor: pointer;
		color: var(--c-text);
	}

	& textarea {
		min-height: 6.25rem;
		resize: vertical;
		line-height: var(--lh-loose);
	}

	& .wpcf7-not-valid {
		border-color: var(--c-error) !important;
		box-shadow: none !important;
	}

	& .wpcf7-not-valid-tip {
		display: block;
		margin-top: var(--s-xs);
		font-size: 0.75rem;
		color: var(--c-error);
	}
}

.wc-cf7__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--s-ld);
}

.wc-cf7__field {
	display: flex;
	flex-direction: column;
	gap: var(--s-xs);

	& label {
		font-size: 0.8125rem;
		font-weight: var(--fw-semibold);
		color: var(--c-brown-600);
		letter-spacing: 0.025em;

		& abbr {
			color: var(--c-primary);
			text-decoration: none;
			margin-left: 2px;
		}
	}
}

.wc-cf7__consent {
	font-size: 0.75rem;
	line-height: var(--lh-loose);
	color: var(--c-brown-600);

	& a {
		color: var(--c-primary);
		text-decoration: underline;

		&:hover,
		&:focus-visible {
			color: var(--c-green-900);
		}
	}
}

.wc-cf7__submit {
	border-top: 1px solid var(--c-cream-700);
	padding-top: var(--s-ld);
	margin-top: var(--s-xs);

	& input[type="submit"] {
		width: 100%;
		min-height: 2.75rem;        /* 44px – cible tactile */
		background: var(--c-brown-600);
		color: var(--c-cream-400);
		padding: var(--s-md) var(--s-2xl);
		font-weight: var(--fw-bold);
		font-size: var(--fs-button);
		letter-spacing: var(--ls-widest);
		text-transform: uppercase;
		border: none;
		border-radius: 0;
		cursor: pointer;
		font-family: inherit;
		transition: background-color var(--tr-base);
		outline: none !important;
		box-shadow: none !important;
		-webkit-tap-highlight-color: transparent !important;

		&:hover,
		&:focus {
			background: var(--c-brown-800);
		}
	}
}

/* ── Messages de réponse CF7 ─────────────────────────────── */

.wpcf7 {
	& .wpcf7-response-output {
		margin: var(--s-sm) 0 0;
		padding: var(--s-md) var(--s-ld);
		border-radius: var(--br-sm);
		font-size: 0.8125rem;
		border: none !important;
	}

	& .wpcf7-mail-sent-ok {
		background: rgba(133, 147, 66, 0.12) !important;
		color: var(--c-green-900) !important;
		border: 1px solid var(--c-primary-light) !important;
	}

	& .wpcf7-mail-sent-ng,
	& .wpcf7-aborted,
	& .wpcf7-spam-blocked {
		background: rgba(192, 57, 43, 0.08) !important;
		color: var(--c-error) !important;
		border: 1px solid rgba(192, 57, 43, 0.3) !important;
	}

	& .wpcf7-validation-errors,
	& .wpcf7-acceptance-missing {
		background: rgba(212, 188, 145, 0.25) !important;
		color: var(--c-brown-600) !important;
		border: 1px solid var(--c-cream-900) !important;
	}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 600px) {
	.wc-cf7__row {
		grid-template-columns: 1fr;
		gap: var(--s-ld);
	}
}