/*
 * Habillage du formulaire de contact Forminator.
 *
 * Reprend les mesures et couleurs de la maquette (l'ancien formulaire Tailwind
 * code en dur dans pages/contact.php, retire depuis).
 *
 * Pourquoi cette feuille est necessaire : le formulaire est en mode couleur
 * « theme » (reglage `cform-color-option`). Dans ce mode, Forminator
 * n'emet AUCUNE couleur dans sa CSS generee
 * (wp-content/uploads/forminator/<id>/css/style-<id>.css) : ni fond de bouton,
 * ni coche, ni couleur de focus. Il attend que le theme les fournisse.
 * Sans ce fichier, le bouton « Envoyer le message » s'affiche en texte nu.
 *
 * `!important` : la CSS generee par Forminator cible avec des selecteurs a ID
 * (#forminator-module-177 ...). C'est le seul moyen de gagner sans coder en
 * dur l'ID du formulaire, qui changerait a la moindre recreation.
 *
 * Chargee en priorite 100 dans functions.php pour passer APRES les feuilles du
 * plugin.
 */

.forminator-custom-wrap {
	--ct-green: #006a4e; /* togo-green */
	--ct-green-hover: #00553f;
	--ct-border: #e2e8f0; /* slate-200 */
	--ct-border-strong: #cbd5e1; /* slate-300 */
	--ct-text: #334155; /* slate-700 */
	--ct-label: #475569; /* slate-600 */
	--ct-muted: #94a3b8; /* slate-400 */
	--ct-red: #ef4444; /* red-500 */
	--ct-gap: 16px;
}

/* ---------------------------------------------------------------------------
 * Grille : gouttiere de 16px (Forminator utilise 30px par defaut)
 * ------------------------------------------------------------------------ */

.forminator-custom-wrap .forminator-row,
.forminator-custom-wrap .forminator-row-inside {
	margin-left: calc(var(--ct-gap) / -2) !important;
	margin-right: calc(var(--ct-gap) / -2) !important;
}

.forminator-custom-wrap .forminator-col {
	padding-left: calc(var(--ct-gap) / 2) !important;
	padding-right: calc(var(--ct-gap) / 2) !important;
}

.forminator-custom-wrap .forminator-row:not(:last-child) {
	margin-bottom: var(--ct-gap) !important;
}

/* Rangee interne Prenom/Nom : pas de compensation verticale. */
.forminator-custom-wrap .forminator-row.forminator-no-margin,
.forminator-custom-wrap .forminator-no-margin > .forminator-col {
	margin-bottom: 0 !important;
}

/* ---------------------------------------------------------------------------
 * Libelles
 * ------------------------------------------------------------------------ */

.forminator-custom-wrap .forminator-label {
	display: block !important;
	margin: 0 0 6px !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	color: var(--ct-text) !important;
}

.forminator-custom-wrap .forminator-required {
	color: var(--ct-red) !important;
}

/* ---------------------------------------------------------------------------
 * Champs texte / e-mail / telephone / message
 * ------------------------------------------------------------------------ */

.forminator-custom-wrap .forminator-input,
.forminator-custom-wrap .forminator-textarea {
	width: 100% !important;
	border: 1px solid var(--ct-border) !important;
	border-radius: 6px !important;
	background-color: #fff !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	color: var(--ct-text) !important;
	box-shadow: none !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.forminator-custom-wrap .forminator-input {
	height: 40px !important;
	min-height: 40px !important;
}

/*
 * Le telephone est enveloppe par intl-tel-input, qui gere lui-meme le
 * padding gauche pour degager le drapeau : on ne touche qu'a droite.
 */
.forminator-custom-wrap .forminator-input:not(.forminator-field--phone) {
	padding: 0 12px !important;
}

.forminator-custom-wrap .forminator-field--phone {
	padding-right: 12px !important;
}

.forminator-custom-wrap .iti {
	display: block !important;
	width: 100% !important;
}

.forminator-custom-wrap .forminator-textarea {
	min-height: 132px !important;
	padding: 10px 12px !important;
	resize: vertical !important;
}

.forminator-custom-wrap .forminator-input::placeholder,
.forminator-custom-wrap .forminator-textarea::placeholder {
	color: var(--ct-muted) !important;
	opacity: 1;
}

.forminator-custom-wrap .forminator-input:focus,
.forminator-custom-wrap .forminator-textarea:focus {
	border-color: var(--ct-green) !important;
	outline: none !important;
	box-shadow: 0 0 0 1px var(--ct-green) !important;
}

/* ---------------------------------------------------------------------------
 * Consentement RGPD
 * ------------------------------------------------------------------------ */

/* La maquette n'affiche pas de libelle au-dessus de la case. */
.forminator-custom-wrap .forminator-field-consent > .forminator-field > .forminator-label {
	display: none !important;
}

.forminator-custom-wrap .forminator-checkbox {
	display: flex !important;
	align-items: center !important;
	margin: 0 !important;
}

.forminator-custom-wrap .forminator-checkbox .forminator-checkbox-box {
	width: 16px !important;
	height: 16px !important;
	flex: 0 0 16px !important;
	border: 1px solid var(--ct-border-strong) !important;
	border-radius: 4px !important;
	background-color: #fff !important;
	color: #fff !important;
}

.forminator-custom-wrap .forminator-checkbox input[type="checkbox"]:checked ~ .forminator-checkbox-box {
	border-color: var(--ct-green) !important;
	background-color: var(--ct-green) !important;
	color: #fff !important;
}

.forminator-custom-wrap .forminator-checkbox .forminator-checkbox-box ~ span {
	margin-left: 8px !important;
	font-size: 12px !important;
	line-height: 1.5 !important;
	color: var(--ct-label) !important;
}

.forminator-custom-wrap .forminator-consent__label a {
	color: var(--ct-green) !important;
	text-decoration: underline;
}

/* ---------------------------------------------------------------------------
 * Bouton d'envoi
 * ------------------------------------------------------------------------ */

.forminator-custom-wrap .forminator-button-submit {
	width: 100% !important;
	height: 44px !important;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 0 !important;
	border-radius: 6px !important;
	background-color: var(--ct-green) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.forminator-custom-wrap .forminator-button-submit:hover,
.forminator-custom-wrap .forminator-button-submit:focus {
	background-color: var(--ct-green-hover) !important;
	color: #fff !important;
}

.forminator-custom-wrap .forminator-button-submit:focus-visible {
	outline: 2px solid var(--ct-green) !important;
	outline-offset: 2px !important;
}

/* ---------------------------------------------------------------------------
 * Messages de validation et de reponse
 * ------------------------------------------------------------------------ */

.forminator-custom-wrap .forminator-error-message {
	margin-top: 4px !important;
	font-size: 11px !important;
	color: var(--ct-red) !important;
}

.forminator-custom-wrap .forminator-input.forminator-has_error,
.forminator-custom-wrap .forminator-textarea.forminator-has_error {
	border-color: var(--ct-red) !important;
	box-shadow: none !important;
}

.forminator-custom-wrap .forminator-response-message {
	margin: 0 0 var(--ct-gap) !important;
	padding: 12px 14px !important;
	border-radius: 6px !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
}

.forminator-custom-wrap .forminator-response-message.forminator-success {
	border: 1px solid var(--ct-green) !important;
	background-color: #ecfdf5 !important;
	color: #065f46 !important;
}

.forminator-custom-wrap .forminator-response-message.forminator-error {
	border: 1px solid var(--ct-red) !important;
	background-color: #fef2f2 !important;
	color: #991b1b !important;
}

/* Forminator masque ce bloc tant qu'il est vide : ne pas creer d'espace. */
.forminator-custom-wrap .forminator-response-message[aria-hidden="true"] {
	display: none !important;
}

/* ---------------------------------------------------------------------------
 * Lien « Edit form »
 *
 * Il est deja retire cote serveur par ambassade_remove_forminator_edit_link()
 * dans functions.php. Cette regle n'est qu'un filet de securite : si une future
 * version de Forminator change le markup du bloc, le retrait PHP echouerait
 * silencieusement et le lien reapparaitrait pour les redacteurs connectes.
 * ------------------------------------------------------------------------ */

.forminator-custom-wrap .forminator-edit-module {
	display: none !important;
}
