/*
 * Formulaire de contact (code court [puiseux_contact]).
 * Chargé uniquement sur les pages qui affichent ce composant.
 */

/* Formulaire de contact, et l'encadré « Mairie » (à droite sur grand écran). */
.puiseux-contact-grille {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	gap: 2rem 2.5rem;
	align-items: flex-start;
	justify-content: flex-end;
}

.puiseux-contact {
	flex: 1 1 24rem;
	max-width: 46rem;
}

.puiseux-contact-mairie {
	/* Assez large pour les horaires sur deux colonnes (jours, plages). */
	flex: 0 1 21rem;
	padding: 1.5rem;
	border-radius: var(--wp--custom--radius--carte, 14px);
	background: var(--wp--preset--color--bleu-clair, #eef6ff);
}

/* Dans la colonne latérale du thème, sous « Je veux… ». */
.puiseux-laterale > .puiseux-contact-mairie {
	margin-top: 2rem;
}

/* Téléphone et tablette : le formulaire, puis la mairie, puis « Je veux… ». */
@media (max-width: 781px) {
	.puiseux-laterale:has(> .puiseux-contact-mairie) {
		display: flex;
		flex-direction: column;
		gap: 2rem;
	}

	.puiseux-laterale > .puiseux-contact-mairie {
		flex: none;
		order: -1;
		margin: 0;
	}
}

.puiseux-contact-mairie h2 {
	margin: 0 0 0.75rem;
	font-size: 1.375rem;
}

.puiseux-contact-mairie h3 {
	margin: 1.25rem 0 0.5rem;
	font-size: 1.0625rem;
}

.puiseux-contact-mairie address {
	font-style: normal;
	line-height: 1.6;
}

.puiseux-contact form > * + * {
	margin-top: 1.25rem;
}

.puiseux-champ label {
	display: block;
	margin-bottom: 0.3rem;
	font-weight: 800;
}

.puiseux-champ input:not([type="checkbox"]),
.puiseux-champ select,
.puiseux-champ textarea {
	width: 100%;
}

.puiseux-champ textarea {
	min-height: 10rem;
	resize: vertical;
}

.puiseux-aide,
.puiseux-erreur {
	margin: 0 0 0.4rem;
}

.puiseux-obligatoire {
	color: var(--wp--preset--color--texte-secondaire, #5f6e7a);
	font-weight: 600;
	font-size: 0.875em;
}

.puiseux-champ-erreur {
	padding-left: 1rem;
	border-left: 4px solid var(--wp--preset--color--rouge, #b3261e);
}

.puiseux-champ-erreur input:not([type="checkbox"]),
.puiseux-champ-erreur select,
.puiseux-champ-erreur textarea {
	border-color: var(--wp--preset--color--rouge, #b3261e);
}

.puiseux-erreur {
	color: var(--wp--preset--color--rouge, #b3261e);
	font-weight: 700;
}

.puiseux-erreur::before {
	content: "Erreur : ";
}

.puiseux-case {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.25rem 0.75rem;
	align-items: start;
}

.puiseux-case .puiseux-erreur {
	grid-column: 1 / -1;
}

.puiseux-case input[type="checkbox"] {
	width: 1.5rem;
	height: 1.5rem;
	margin: 0.15rem 0 0;
	accent-color: var(--wp--preset--color--bleu, #004b8d);
}

.puiseux-case label {
	margin: 0;
	font-weight: 400;
}

.puiseux-message {
	margin-bottom: 1.5rem;
	padding: 1.1rem 1.25rem;
	border-left: 5px solid;
	border-radius: 0 var(--wp--custom--radius--petit, 12px) var(--wp--custom--radius--petit, 12px) 0;
}

.puiseux-message:focus {
	outline: 3px solid var(--wp--preset--color--bleu, #004b8d);
	outline-offset: 2px;
}

.puiseux-message p,
.puiseux-message ul {
	margin: 0;
}

.puiseux-message ul {
	margin-top: 0.5rem;
	padding-left: 1.25rem;
}

.puiseux-message-succes {
	border-color: var(--wp--preset--color--vert, #247048);
	background: var(--wp--preset--color--vert-clair, #dff3e7);
}

.puiseux-message-erreur {
	border-color: var(--wp--preset--color--rouge, #b3261e);
	background: #fdeceb;
}

/* Piège à robots : invisible pour tout le monde, y compris les lecteurs d'écran. */
.puiseux-piege {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}