/*
 * Formulaires Forminator (page « Rejoindre », questionnaires des consultations) : habillage
 * selon le design system V2.1. Les formulaires sont réglés sur le style « Aucun » dans
 * Forminator : seul le thème les met en forme. Aucune modification du plugin ; sélecteurs
 * limités à .page-join et .consultation-form (même spécificité qu'une classe seule).
 * Ajustements propres aux consultations : consultation.css.
 */

:is(.page-join, .consultation-form) .forminator-ui {
	--join-gap: var(--space-5);

	margin-block: var(--space-6) var(--space-7);
	counter-reset: egd-section;
	font-family: var(--font-sans);
}

:is(.page-join, .consultation-form) .forminator-ui * {
	box-sizing: border-box;
}

/* Grille : deux colonnes quand c'est utile, une seule sous 768px */
:is(.page-join, .consultation-form) .forminator-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--join-gap) var(--space-5);
	margin: 0;
}

:is(.page-join, .consultation-form) .forminator-row + .forminator-row {
	margin-top: var(--join-gap);
}

:is(.page-join, .consultation-form) .forminator-col {
	flex: 1 1 100%;
	min-width: 0;
	padding: 0;
}

@media (min-width: 48em) {
	:is(.page-join, .consultation-form) .forminator-col-6 {
		flex-basis: calc(50% - var(--space-5) / 2);
	}
}

/* Sections 01–04 : numéro automatique, titre éditable dans Forminator */
:is(.page-join, .consultation-form) .forminator-field-section {
	margin-top: var(--space-7);
}

/* Le filet est porté par le bloc interne : la colonne Forminator a des marges internes. */
:is(.page-join, .consultation-form) .forminator-field-section .forminator-field {
	padding-top: var(--space-6);
	border-top: 1px solid var(--color-border);
}

:is(.page-join, .consultation-form) .forminator-row:first-of-type .forminator-field-section {
	margin-top: 0;
}

:is(.page-join, .consultation-form) .forminator-row:first-of-type .forminator-field-section .forminator-field {
	padding-top: 0;
	border-top: 0;
}

:is(.page-join, .consultation-form) .forminator-field-section .forminator-title {
	display: grid;
	gap: var(--space-2);
	margin: 0;
	color: var(--color-heading);
	font-family: var(--font-serif);
	font-size: var(--text-h3);
	font-weight: var(--weight-heading);
	line-height: 1.2;
}

:is(.page-join, .consultation-form) .forminator-field-section .forminator-title::before {
	content: counter(egd-section, decimal-leading-zero);
	counter-increment: egd-section;
	color: var(--color-blue-700);
	font-family: var(--font-sans);
	font-size: var(--text-small);
	font-weight: var(--weight-semibold);
	letter-spacing: 0.12em;
}

/* Libellés, aides, compteurs */
:is(.page-join, .consultation-form) .forminator-label {
	display: block;
	margin: 0 0 var(--space-2);
	color: var(--color-gray-900);
	font-size: var(--text-ui);
	font-weight: var(--weight-semibold);
	line-height: 1.4;
}

:is(.page-join, .consultation-form) .forminator-required {
	color: var(--color-danger);
}

:is(.page-join, .consultation-form) .forminator-description > span:last-child {
	flex: none;
	white-space: nowrap;
}

:is(.page-join, .consultation-form) .forminator-description {
	display: flex;
	justify-content: space-between;
	gap: var(--space-3);
	margin: calc(-1 * var(--space-1)) 0 var(--space-2);
	color: var(--color-text-muted);
	font-size: var(--text-small);
	line-height: 1.45;
}

/* Champs texte et liste */
:is(.page-join, .consultation-form) .forminator-input,
:is(.page-join, .consultation-form) .forminator-textarea,
:is(.page-join, .consultation-form) select {
	width: 100%;
	min-height: 3rem;
	padding: var(--space-3) var(--space-4);
	border: 1px solid var(--color-border-input);
	border-radius: var(--radius-sm);
	background-color: var(--color-surface);
	color: var(--color-gray-900);
	font: inherit;
	font-size: var(--text-ui);
	line-height: 1.4;
	caret-color: var(--color-blue-700);
	transition: border-color var(--duration-fast) ease;
}

:is(.page-join, .consultation-form) select {
	padding-right: var(--space-7);
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2312315A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-position: right var(--space-4) center;
	background-repeat: no-repeat;
	background-size: 1.125rem;
}

:is(.page-join, .consultation-form) :is(.forminator-input, .forminator-textarea, select):hover {
	border-color: var(--color-blue-800);
}

:is(.page-join, .consultation-form) :is(.forminator-input, .forminator-textarea, select):focus-visible {
	border-color: var(--color-blue-700);
	outline: 3px solid var(--color-focus);
	outline-offset: 1px;
}

/* Choix : des tuiles lisibles et faciles à toucher, sur plusieurs colonnes */
:is(.page-join, .consultation-form) .forminator-field[role="group"],
:is(.page-join, .consultation-form) .forminator-field[role="radiogroup"] {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
	gap: var(--space-2) var(--space-3);
}

:is(.page-join, .consultation-form) .forminator-field[role="group"] > :not(label),
:is(.page-join, .consultation-form) .forminator-field[role="radiogroup"] > :not(label) {
	grid-column: 1 / -1;
}

:is(.page-join, .consultation-form) :is(.forminator-radio, .forminator-checkbox) {
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--space-3);
	min-height: 3rem;
	margin: 0;
	padding: var(--space-2) var(--space-4);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	background: var(--color-surface);
	color: var(--color-gray-900);
	font-size: var(--text-ui);
	line-height: 1.35;
	cursor: pointer;
	transition: border-color var(--duration-fast) ease, background-color var(--duration-fast) ease;
}

:is(.page-join, .consultation-form) :is(.forminator-radio, .forminator-checkbox):hover {
	border-color: var(--color-blue-800);
}

:is(.page-join, .consultation-form) :is(.forminator-radio, .forminator-checkbox):has(input:checked) {
	border-color: var(--color-blue-700);
	background: var(--color-ivory-50);
}

/* La case native reste l'élément interactif (clavier, lecteurs d'écran) ; elle est seulement redessinée. */
:is(.page-join, .consultation-form) :is(.forminator-radio, .forminator-checkbox) input {
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	margin: 0;
	border: 1.5px solid var(--color-border-input);
	background: var(--color-surface);
	cursor: pointer;
	appearance: none;
}

:is(.page-join, .consultation-form) .forminator-radio input {
	border-radius: 50%;
}

:is(.page-join, .consultation-form) .forminator-checkbox input {
	border-radius: 0.3125rem;
}

:is(.page-join, .consultation-form) :is(.forminator-radio, .forminator-checkbox) input:checked {
	border-color: var(--color-blue-900);
	background-color: var(--color-blue-900);
}

:is(.page-join, .consultation-form) .forminator-checkbox input:checked {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 0.875rem;
}

:is(.page-join, .consultation-form) .forminator-radio input:checked {
	box-shadow: inset 0 0 0 4px var(--color-surface);
}

:is(.page-join, .consultation-form) :is(.forminator-radio, .forminator-checkbox) input:focus-visible {
	outline: 3px solid var(--color-focus);
	outline-offset: 2px;
}

/* Les puces décoratives de Forminator ne servent pas : la case native est redessinée. */
:is(.page-join, .consultation-form) :is(.forminator-radio-bullet, .forminator-checkbox-box) {
	display: none;
}

/* Consentement : encadré ivoire, case bien visible (sur le bloc interne, aligné sur les champs) */
:is(.page-join, .consultation-form) .forminator-field-consent {
	margin-top: var(--space-6);
}

:is(.page-join, .consultation-form) .forminator-field-consent .forminator-field {
	padding: var(--space-5);
	border-radius: var(--radius-md);
	background: var(--color-bg-alt);
}

:is(.page-join, .consultation-form) .forminator-field-consent .forminator-checkbox {
	align-items: flex-start;
	padding: 0;
	border: 0;
	background: none;
	color: var(--color-gray-900);
	font-size: var(--text-small);
	line-height: 1.6;
}

:is(.page-join, .consultation-form) .forminator-field-consent .forminator-checkbox input {
	margin-top: 0.125rem;
}

:is(.page-join, .consultation-form) .forminator-field-consent a {
	color: var(--color-link);
	font-weight: var(--weight-semibold);
}

/* Bouton : action principale dorée */
:is(.page-join, .consultation-form) .forminator-row-last {
	margin-top: var(--space-6);
}

:is(.page-join, .consultation-form) .forminator-button-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	min-height: 3rem;
	padding: var(--space-2) var(--space-6);
	border: 2px solid var(--color-gold-500);
	border-radius: var(--radius-sm);
	background: var(--color-gold-500);
	color: var(--color-blue-900);
	font-family: var(--font-sans);
	font-size: var(--text-ui);
	font-weight: var(--weight-semibold);
	line-height: 1.25;
	cursor: pointer;
	transition: background-color var(--duration-fast) ease, border-color var(--duration-fast) ease;
}

:is(.page-join, .consultation-form) .forminator-button-submit::after {
	content: "";
	width: 1.125rem;
	height: 1.125rem;
	background: currentColor;
	-webkit-mask: var(--icon-arrow) center / contain no-repeat;
	mask: var(--icon-arrow) center / contain no-repeat;
}

:is(.page-join, .consultation-form) .forminator-button-submit:hover {
	border-color: var(--color-gold-600);
	background: var(--color-gold-600);
}

:is(.page-join, .consultation-form) .forminator-button-submit:focus-visible {
	outline: var(--focus-ring);
	outline-offset: 3px;
}

:is(.page-join, .consultation-form) .forminator-button-submit:disabled {
	border-color: var(--color-gray-200);
	background: var(--color-gray-200);
	color: var(--color-gray-500);
	cursor: not-allowed;
}

@media (max-width: 47.9375em) {
	:is(.page-join, .consultation-form) .forminator-button-submit {
		width: 100%;
	}
}

/* Erreurs : bordure + icône + message (jamais la couleur seule) */
:is(.page-join, .consultation-form) .forminator-error-message {
	display: flex;
	align-items: flex-start;
	gap: var(--space-2);
	margin-top: var(--space-2);
	color: var(--color-danger);
	font-size: var(--text-small);
	font-weight: var(--weight-medium);
}

:is(.page-join, .consultation-form) .forminator-error-message::before {
	content: "";
	flex: none;
	width: 1.125rem;
	height: 1.125rem;
	margin-top: 0.0625rem;
	background: currentColor;
	-webkit-mask: var(--icon-alert) center / contain no-repeat;
	mask: var(--icon-alert) center / contain no-repeat;
}

:is(.page-join, .consultation-form) .forminator-has_error :is(.forminator-input, .forminator-textarea, select),
:is(.page-join, .consultation-form) .forminator-has_error :is(.forminator-radio, .forminator-checkbox) {
	border-width: 2px;
	border-color: var(--color-danger);
}

/* Message global (erreur ou succès) */
:is(.page-join, .consultation-form) .forminator-response-message:not(:empty) {
	margin-bottom: var(--space-5);
	padding: var(--space-4) var(--space-5);
	border-radius: var(--radius-sm);
	font-size: var(--text-ui);
}

:is(.page-join, .consultation-form) .forminator-response-message[aria-hidden="true"] {
	display: none;
}

:is(.page-join, .consultation-form) .forminator-response-message.forminator-error {
	border: 2px solid var(--color-danger);
	background: var(--color-surface);
	color: var(--color-gray-900);
}

:is(.page-join, .consultation-form) .forminator-response-message.forminator-success {
	padding: var(--space-6);
	border: 1px solid var(--color-border);
	border-left: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: var(--color-bg-alt);
	color: var(--color-gray-900);
}

:is(.page-join, .consultation-form) .forminator-response-message.forminator-success p + p {
	margin-top: var(--space-3);
}

:is(.page-join, .consultation-form) .forminator-response-message.forminator-success strong {
	display: block;
	color: var(--color-heading);
	font-family: var(--font-serif);
	font-size: var(--text-h3);
	font-weight: var(--weight-heading);
	line-height: 1.2;
}

/* Note de confidentialité sous le formulaire */
:is(.page-join, .consultation-form) .join-privacy {
	padding-top: var(--space-5);
	border-top: 1px solid var(--color-border);
	color: var(--color-text-muted);
	font-size: var(--text-small);
}

/* Consentement : Forminator place la case et son texte côte à côte dans un conteneur dédié. */
:is(.page-join, .consultation-form) .forminator-checkbox__wrapper {
	display: flex;
	align-items: flex-start;
	gap: var(--space-3);
}

:is(.page-join, .consultation-form) .forminator-consent__label {
	color: var(--color-gray-900);
	font-size: var(--text-small);
	line-height: 1.6;
}
