/*
 * Formulaires.
 *
 * Elementor rend des champs très neutres. On leur donne le vocabulaire du site :
 * angles droits, filet discret, focus bleu franc, étiquettes lisibles.
 */

.elementor-widget-form {
	--qv-accent: #1976b8;
	--qv-marine: #0d1f35;
	--qv-gris: #6b7280;
	--qv-bord: #d1d5db;
}

.elementor-widget-form .elementor-field-group > label {
	margin-bottom: 7px;
	font-size: 13px;
	font-weight: 600;
	color: var(--qv-marine);
	letter-spacing: .01em;
}

.elementor-widget-form .elementor-field-group .elementor-field-required .elementor-mark-required,
.elementor-widget-form .elementor-mark-required {
	margin-left: 3px;
	color: #dc2626;
}

.elementor-widget-form .elementor-field-textual {
	padding: 13px 15px;
	font-size: 15px;
	line-height: 1.4;
	color: var(--qv-marine);
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 0;
	box-shadow: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.elementor-widget-form .elementor-field-textual::placeholder {
	color: #9ca3af;
}

.elementor-widget-form .elementor-field-textual:hover {
	background: #f3f4f6;
	border-color: #d1d5db;
}

.elementor-widget-form .elementor-field-textual:focus {
	background: #fff;
	border-color: var(--qv-accent);
	outline: none;
	box-shadow: 0 0 0 3px rgba(25, 118, 184, .16);
}

.elementor-widget-form textarea.elementor-field-textual {
	min-height: 150px;
	resize: vertical;
}

/* Listes déroulantes : la flèche native est remplacée pour rester cohérente. */
.elementor-widget-form select.elementor-field-textual {
	padding-right: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-color: #f9fafb !important;
	background-size: 16px 16px !important;
	appearance: none;
	-webkit-appearance: none;
}

/* Cases à cocher : cible unique étiquette + contrôle, pas de zone morte. */
.elementor-widget-form .elementor-field-type-acceptance .elementor-field-option {
	display: flex;
	gap: 11px;
	align-items: flex-start;
	padding: 4px 0;
}

.elementor-widget-form .elementor-field-type-acceptance input[type="checkbox"] {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: 2px;
	accent-color: var(--qv-accent);
}

.elementor-widget-form .elementor-field-type-acceptance label {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
	color: var(--qv-gris);
	cursor: pointer;
}

.elementor-widget-form .elementor-field-type-acceptance label a {
	color: var(--qv-accent);
}

/* Bouton d'envoi. */
.elementor-widget-form .elementor-button[type="submit"] {
	padding: 15px 28px;
	font-size: 15px;
	font-weight: 600;
	border-radius: 0;
	transition: background-color .15s ease, transform .12s ease;
}

.elementor-widget-form .elementor-button[type="submit"]:active {
	transform: translateY(1px);
}

.elementor-widget-form .elementor-button[type="submit"]:focus-visible {
	outline: 2px solid var(--qv-accent);
	outline-offset: 3px;
}

/* Messages. */
.elementor-widget-form .elementor-message {
	margin-top: 14px;
	padding: 12px 15px;
	font-size: 14px;
	line-height: 1.6;
	border-left: 3px solid;
}

.elementor-widget-form .elementor-message-success {
	color: #15803d;
	background: #f0fdf4;
	border-color: #22c55e;
}

.elementor-widget-form .elementor-message-danger,
.elementor-widget-form .elementor-message-error {
	color: #b91c1c;
	background: #fef2f2;
	border-color: #dc2626;
}

.elementor-widget-form .elementor-field-group .elementor-error .elementor-field-textual {
	border-color: #dc2626;
}

/* Espacement vertical entre les champs. */
.elementor-widget-form .elementor-form-fields-wrapper {
	row-gap: 6px;
}

/* Piège anti-spam de WP Armour.
   L'extension injecte « <label>Alternative:</label> » suivi d'un champ, sans le
   masquer : il s'affichait en clair au bas de chaque formulaire et s'intercalait
   dans la tabulation juste après le bouton d'envoi. Il reste dans la page — c'est
   lui qui attrape les robots — mais hors de vue et hors du flux. */
.altEmail_container {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

/* Cibles tactiles des cases et boutons radio.
   Les contrôles natifs mesurent 13 px : sous le minimum de 24 px, et loin des
   44 px confortables au doigt. On agrandit le contrôle et on étire la zone
   cliquable jusqu'à son libellé, qui lui est déjà rattaché. */
.elementor-field-subgroup .elementor-field-option,
.elementor-field-type-acceptance .elementor-field-option {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 32px;
	padding: 4px 0;
}

.elementor-field-subgroup input[type="checkbox"],
.elementor-field-subgroup input[type="radio"],
.elementor-field-type-acceptance input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 0;
	flex: 0 0 auto;
	accent-color: var( --qv-accent, #1976b8 );
	cursor: pointer;
	touch-action: manipulation;
}

.elementor-field-subgroup label,
.elementor-field-type-acceptance label {
	cursor: pointer;
	line-height: 1.4;
	touch-action: manipulation;
}

/* L'étoile des champs obligatoires ne couvrait pas les cases d'acceptation :
   « je m'engage à payer ma cotisation » est pourtant obligatoire. */
.elementor-field-type-acceptance.elementor-field-required .elementor-field-option label::after,
.elementor-field-type-acceptance .elementor-field-option label:has( input[required] )::after {
	content: " *";
	color: #b32d2e;
	font-weight: 600;
}