/**
 * Formulaire de contact (page « Contact ») — Frontend\Contact_Form.
 * S'appuie sur les tokens --cdv-* de canardises-design-system.css (thème
 * enfant), chargés globalement sur :root. Fichier volontairement autonome
 * (plugin) pour ne pas dépendre des feuilles du thème.
 */

.cdv-cf-wrap {
	margin-top: 3rem;
	max-width: 640px;
}

/* Phrase « Vous pouvez aussi me contacter directement… » (page-contact.php). */
.canardises-contact .cdv-ct-direct {
	margin: 1.5rem 0 0;
	font-size: 1rem;
	line-height: 1.65;
	color: var(--cdv-ink, #5b0e1a);
}

.canardises-contact .cdv-ct-direct a {
	color: var(--cdv-terracotta, #97362b);
}

/* --- Accusés / erreurs --- */
.cdv-cf-notice {
	margin: 0 0 1.5rem;
	padding: 0.9rem 1.1rem;
	font-size: 0.95rem;
	line-height: 1.55;
	border-left: 3px solid;
	border-radius: var(--cdv-radius, 2px);
}

.cdv-cf-notice--ok {
	border-left-color: var(--cdv-terracotta, #97362b);
	background: var(--cdv-terracotta-soft, #f6e1d8);
	color: var(--cdv-ink, #5b0e1a);
}

.cdv-cf-notice--error {
	border-left-color: #b3261e;
	background: #fbeae8;
	color: #7a1a15;
}

/* --- Structure --- */
.cdv-cf-row {
	margin-top: 1.4rem;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.cdv-cf-grid2 {
	display: grid;
	gap: 0 1.25rem;
}

@media (min-width: 560px) {
	.cdv-cf-grid2 { grid-template-columns: 1fr 1fr; }
}

.cdv-cf-group {
	margin-top: 0.5rem;
	padding-top: 0.5rem;
}

.cdv-cf label {
	font-size: 0.72rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cdv-ink-faint, #8a5b52);
}

.cdv-cf-req { color: var(--cdv-terracotta, #97362b); }
.cdv-cf-opt {
	letter-spacing: 0.04em;
	text-transform: none;
	color: var(--cdv-ink-faint, #8a5b52);
	opacity: 0.8;
}

.cdv-cf input[type="text"],
.cdv-cf input[type="email"],
.cdv-cf input[type="tel"],
.cdv-cf select,
.cdv-cf textarea {
	width: 100%;
	padding: 0.7rem 0.8rem;
	font-family: var(--cdv-font-body, system-ui, sans-serif);
	font-size: 1rem;
	color: var(--cdv-ink, #5b0e1a);
	background: #fff;
	border: 1px solid var(--cdv-border-strong, rgba(91, 14, 26, 0.26));
	border-radius: var(--cdv-radius, 2px);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.cdv-cf 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 fill='%2397362b' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.9rem center;
	padding-right: 2.4rem;
}

.cdv-cf textarea {
	resize: vertical;
	min-height: 3.5rem;
}

.cdv-cf input:focus,
.cdv-cf select:focus,
.cdv-cf textarea:focus {
	outline: none;
	border-color: var(--cdv-terracotta, #97362b);
	box-shadow: 0 0 0 3px var(--cdv-terracotta-soft, #f6e1d8);
}

/* --- Consentement --- */
.cdv-cf-consent label {
	flex-direction: row;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.9rem;
	letter-spacing: 0;
	text-transform: none;
	color: var(--cdv-ink-faint, #8a5b52);
	line-height: 1.5;
}

.cdv-cf-consent input[type="checkbox"] {
	flex: 0 0 auto;
	margin-top: 0.15rem;
	width: 1rem;
	height: 1rem;
	accent-color: var(--cdv-terracotta, #97362b);
}

.cdv-cf-consent a {
	color: var(--cdv-terracotta, #97362b);
	text-decoration: underline;
}

/* --- Légende de l'astérisque (sous le formulaire, près du bouton) --- */
.cdv-cf-legend {
	margin: 1.6rem 0 0;
	font-size: 0.8rem;
	letter-spacing: 0;
	text-transform: none;
	color: var(--cdv-ink-faint, #8a5b52);
}

/* --- Erreurs de champ (nom, e-mail, message, consentement : même classe) --- */
.cdv-cf-error {
	font-size: 0.85rem;
	letter-spacing: 0;
	text-transform: none;
	font-weight: 700;
	color: #b3261e;
}

.cdv-cf-error::before {
	content: "> ";
}

.cdv-cf-row:has(.cdv-cf-error) input,
.cdv-cf-row:has(.cdv-cf-error) select,
.cdv-cf-row:has(.cdv-cf-error) textarea {
	border-color: #b3261e;
}

/* --- Bouton --- */
.cdv-cf-submit.button,
.cdv-cf-submit {
	margin-top: 1.8rem;
	padding: 0.85rem 1.8rem;
	font-family: var(--cdv-font-body, system-ui, sans-serif);
	font-size: 0.8rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #fff;
	background: var(--cdv-terracotta, #97362b);
	border: 1px solid var(--cdv-terracotta, #97362b);
	border-radius: var(--cdv-radius, 2px);
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.cdv-cf-submit:hover {
	background: var(--cdv-terracotta-deep, #5c2019);
	border-color: var(--cdv-terracotta-deep, #5c2019);
}

/* --- Pot de miel : hors écran, jamais visible --- */
.cdv-cf-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
