/*
 * Féy-Loisirs
 * Interface publique du moteur d'inscription.
 *
 * Ce fichier contient le socle visuel du formulaire.
 * Les finitions seront complétées au fil du développement.
 */

:root {
	--fls-reg-purple: #755a8f;
	--fls-reg-purple-dark: #5d4673;
	--fls-reg-purple-soft: #f2edf6;
	--fls-reg-turquoise: #008ca3;
	--fls-reg-turquoise-dark: #006f82;
	--fls-reg-turquoise-soft: #e4f5f7;
	--fls-reg-sage: #91a68e;
	--fls-reg-sage-soft: #eef3ed;
	--fls-reg-cream: #fbf8f1;
	--fls-reg-white: #ffffff;
	--fls-reg-text: #302b32;
	--fls-reg-muted: #716a74;
	--fls-reg-border: #e7e0e9;
	--fls-reg-success: #4f7658;
	--fls-reg-success-soft: #edf5ef;
	--fls-reg-warning: #8a6a24;
	--fls-reg-warning-soft: #fff8e7;
	--fls-reg-danger: #9e4141;
	--fls-reg-danger-soft: #fff0f0;
	--fls-reg-radius: 18px;
	--fls-reg-radius-small: 12px;
	--fls-reg-shadow: 0 14px 40px rgba(61, 46, 68, 0.08);
}

/*
 * Socle général
 */

.fls-registration-login,
.fls-registration-path,
.fls-registration-household,
.fls-registration-participant,
.fls-registration-activities,
.fls-registration-summary {
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 24px;
	padding: 28px;
	color: var(--fls-reg-text);
	background: var(--fls-reg-white);
	border: 1px solid var(--fls-reg-border);
	border-radius: var(--fls-reg-radius);
	box-shadow: var(--fls-reg-shadow);
}

.fls-registration-login *,
.fls-registration-path *,
.fls-registration-household *,
.fls-registration-participant *,
.fls-registration-activities *,
.fls-registration-summary * {
	box-sizing: border-box;
}

/*
 * Connexion
 */

.fls-registration-login__header {
	margin-bottom: 24px;
}

.fls-registration-login__header h3 {
	margin: 6px 0 8px;
	color: var(--fls-reg-text);
	font-size: clamp(1.35rem, 2vw, 1.7rem);
	line-height: 1.2;
}

.fls-registration-login__header p {
	margin: 8px 0 0;
	color: var(--fls-reg-muted);
	line-height: 1.6;
}

.fls-registration-login__form {
	display: grid;
	width: 100%;
	max-width: 640px;
	gap: 18px;
	margin: 0;
}

.fls-registration-login__field {
	min-width: 0;
}

.fls-registration-login__field label {
	display: block;
	margin-bottom: 7px;
	color: var(--fls-reg-text);
	font-weight: 650;
}

.fls-registration-login__field input {
	display: block;
	width: 100%;
	max-width: none;
	min-height: 48px;
	padding: 10px 13px;
	color: var(--fls-reg-text);
	background: var(--fls-reg-white);
	border: 1px solid #d8d0da;
	border-radius: 10px;
	outline: none;
	transition:
		border-color 160ms ease,
		box-shadow 160ms ease;
}

.fls-registration-login__field input:focus {
	border-color: var(--fls-reg-purple);
	box-shadow: 0 0 0 3px rgba(117, 90, 143, 0.13);
}

.fls-registration-login__remember {
	display: flex;
	align-items: center;
	gap: 9px;
}

.fls-registration-login__remember input[type="checkbox"] {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--fls-reg-purple);
}

.fls-registration-login__remember label {
	margin: 0;
	color: var(--fls-reg-text);
	line-height: 1.4;
	cursor: pointer;
}

.fls-registration-login__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 4px;
}

.fls-registration-login__actions button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px 18px;
	color: var(--fls-reg-white);
	background: var(--fls-reg-purple);
	border: 1px solid var(--fls-reg-purple);
	border-radius: 10px;
	font: inherit;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	cursor: pointer;
	transition:
		background 160ms ease,
		border-color 160ms ease,
		color 160ms ease,
		transform 160ms ease,
		box-shadow 160ms ease;
}

.fls-registration-login__actions button:hover {
	color: var(--fls-reg-white);
	background: var(--fls-reg-purple-dark);
	border-color: var(--fls-reg-purple-dark);
	box-shadow: 0 7px 18px rgba(93, 70, 115, 0.16);
	transform: translateY(-1px);
}

.fls-registration-login__actions a {
	color: var(--fls-reg-purple-dark);
	font-weight: 650;
	text-underline-offset: 3px;
}

.fls-registration-login__actions a:hover {
	color: var(--fls-reg-purple);
}

.fls-registration-login__actions button:focus-visible,
.fls-registration-login__actions a:focus-visible,
.fls-registration-login__remember input:focus-visible {
	outline: 3px solid rgba(117, 90, 143, 0.24);
	outline-offset: 2px;
}

.fls-registration-path__header,
.fls-registration-household__header,
.fls-registration-participant__header,
.fls-registration-activities__header {
	margin-bottom: 24px;
}

.fls-registration-path__header h2,
.fls-registration-household__header h2,
.fls-registration-participant__header h2,
.fls-registration-activities__header h2 {
	margin: 6px 0 8px;
	color: var(--fls-reg-text);
	font-size: clamp(1.55rem, 2vw, 2rem);
	line-height: 1.2;
}

.fls-registration-path__header p,
.fls-registration-household__header p,
.fls-registration-participant__header p,
.fls-registration-activities__header p {
	margin-top: 8px;
	color: var(--fls-reg-muted);
	line-height: 1.6;
}

.fls-registration-path__step,
.fls-registration-household__step,
.fls-registration-participant__step,
.fls-registration-activities__step {
	display: inline-flex;
	align-items: center;
	width: auto;
	margin: 0;
	padding: 6px 11px;
	color: var(--fls-reg-purple-dark) !important;
	background: var(--fls-reg-purple-soft);
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

/*
 * Champs
 */

.fls-registration-household__row,
.fls-registration-participant__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}
/*
 * Identité du participant
 */
.fls-registration-participant__row--identity {
	grid-template-columns:
		minmax(0, 1fr)
		minmax(0, 1fr)
		190px;
	align-items: end;
}

.fls-registration-participant__field--birth-date {
	min-width: 0;
}

.fls-registration-participant__field--birth-date input[type="date"] {
	width: 190px;
	max-width: 100%;
}

.fls-registration-participant__field--birth-date-solo {
	max-width: 190px;
}

.fls-registration-household__field,
.fls-registration-participant__field {
	margin-bottom: 18px;
}

.fls-registration-household__field label,
.fls-registration-participant__field label {
	display: block;
	margin-bottom: 7px;
	color: var(--fls-reg-text);
	font-weight: 650;
}

.fls-registration-household__field input,
.fls-registration-household__field textarea,
.fls-registration-participant__field input {
	width: 100%;
	min-height: 48px;
	padding: 10px 13px;
	color: var(--fls-reg-text);
	background: var(--fls-reg-white);
	border: 1px solid #d8d0da;
	border-radius: 10px;
	outline: none;
	transition:
		border-color 160ms ease,
		box-shadow 160ms ease;
}

.fls-registration-household__field input:focus,
.fls-registration-household__field textarea:focus,
.fls-registration-participant__field input:focus {
	border-color: var(--fls-reg-purple);
	box-shadow: 0 0 0 3px rgba(117, 90, 143, 0.13);
}

.fls-registration-household__country {
	margin-bottom: 20px;
	padding: 13px 15px;
	background: var(--fls-reg-cream);
	border-radius: var(--fls-reg-radius-small);
}

.fls-registration-household__country p {
	margin: 3px 0 0;
}

/*
 * Boutons
 */

.fls-registration-path button,
.fls-registration-household button,
.fls-registration-participant button,
.fls-registration-activities button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px 18px;

	color: var(--fls-reg-white);
	background: var(--fls-reg-purple);
	border: 1px solid var(--fls-reg-purple);
	border-radius: 10px;

	font: inherit;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;

	cursor: pointer;

	transition:
		background 160ms ease,
		border-color 160ms ease,
		color 160ms ease,
		transform 160ms ease,
		box-shadow 160ms ease;
}

.fls-registration-path button:hover,
.fls-registration-household button:hover,
.fls-registration-participant button:hover,
.fls-registration-activities button:hover {
	background: var(--fls-reg-purple-dark);
	border-color: var(--fls-reg-purple-dark);
	box-shadow: 0 7px 18px rgba(93, 70, 115, 0.16);
	transform: translateY(-1px);
}

.fls-registration-path button:focus-visible,
.fls-registration-household button:focus-visible,
.fls-registration-participant button:focus-visible,
.fls-registration-activities button:focus-visible,
.fls-registration-path a:focus-visible,
.fls-registration-participant a:focus-visible {
	outline: 3px solid rgba(117, 90, 143, 0.24);
	outline-offset: 2px;
}

/*
 * Choix Solo / Enfant / Famille
 */

.fls-registration-path__options {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 0;
	padding: 0;
	border: 0;
}

.fls-registration-path__options > legend {
	width: 100%;
	margin-bottom: 12px;
	font-weight: 700;
}

.fls-registration-path__option {
	position: relative;
	display: block;
	min-height: 145px;
	padding: 18px;
	background: var(--fls-reg-white);
	border: 1px solid var(--fls-reg-border);
	border-radius: 14px;
	cursor: pointer;
	transition:
		border-color 160ms ease,
		background 160ms ease,
		box-shadow 160ms ease,
		transform 160ms ease;
}

.fls-registration-path__option:hover {
	border-color: #cbbbd5;
	box-shadow: 0 8px 20px rgba(61, 46, 68, 0.07);
	transform: translateY(-1px);
}

.fls-registration-path__option:has(input:checked) {
	background: var(--fls-reg-purple-soft);
	border-color: var(--fls-reg-purple);
	box-shadow: 0 0 0 2px rgba(117, 90, 143, 0.08);
}

.fls-registration-path__option input {
	margin: 0 0 14px;
	accent-color: var(--fls-reg-purple);
}

.fls-registration-path__option-content {
	display: grid;
	gap: 7px;
}

.fls-registration-path__option-content strong {
	font-size: 1.05rem;
}

.fls-registration-path__option-content span {
	color: var(--fls-reg-muted);
	line-height: 1.5;
}

.fls-registration-path__actions,
.fls-registration-household__actions,
.fls-registration-participant__actions,
.fls-registration-activities__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 24px;
}

.fls-registration-activities__actions {
	justify-content: space-between;
}

.fls-registration-activities button.fls-registration-activities__back-button {
	color: var(--fls-reg-purple-dark);
	background: transparent;
	border-color: transparent;
}

.fls-registration-activities button.fls-registration-activities__back-button:hover {
	color: var(--fls-reg-purple);
	background: var(--fls-reg-purple-soft);
	border-color: transparent;
	box-shadow: none;
}

/*
 * Participants
 */

.fls-registration-participant__list {
	display: grid;
	gap: 12px;
	margin-bottom: 24px;
}

.fls-registration-participant__list h3 {
	margin-bottom: 4px;
}

.fls-registration-participant__card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 16px;
	background: var(--fls-reg-cream);
	border: 1px solid var(--fls-reg-border);
	border-radius: 13px;
}

.fls-registration-participant__identity {
	display: grid;
	gap: 3px;
}

.fls-registration-participant__identity span {
	color: var(--fls-reg-muted);
	font-size: 0.92rem;
}

.fls-registration-participant__card-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: nowrap;
	gap: 10px;
}

.fls-registration-participant__card-actions form {
	display: flex;
	align-items: center;

	height: 40px;
	margin: 0 !important;
	padding: 0 !important;
}

.fls-registration-participant__card-actions button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 100px;
	height: 40px;
	min-width: 100px;
	min-height: 40px;

	margin: 0 !important;
	padding: 0 12px;

	font-size: 0.88rem;
	line-height: 1;
}

.fls-registration-participant__edit-form button {
	color: var(--fls-reg-purple-dark);
	background: var(--fls-reg-white);
	border-color: #cfc2d8;
}

.fls-registration-participant__edit-form button:hover {
	color: var(--fls-reg-white);
	background: var(--fls-reg-purple);
	border-color: var(--fls-reg-purple);
}

.fls-registration-participant__card-actions
	form:not(.fls-registration-participant__edit-form)
	button {
	color: var(--fls-reg-danger);
	background: var(--fls-reg-danger-soft);
	border-color: #e3bcbc;
}

.fls-registration-participant__card-actions
	form:not(.fls-registration-participant__edit-form)
	button:hover {
	color: var(--fls-reg-white);
	background: var(--fls-reg-danger);
	border-color: var(--fls-reg-danger);
	box-shadow: 0 7px 18px rgba(158, 65, 65, 0.14);
}

.fls-registration-participant__actions > button {
	min-width: 220px;
}

.fls-registration-participant__actions > a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 8px 4px;

	color: var(--fls-reg-muted);
	font-weight: 650;
	text-decoration: none;

	transition:
		color 150ms ease,
		text-decoration-color 150ms ease;
}

.fls-registration-participant__actions > a:hover {
	color: var(--fls-reg-purple-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.fls-registration-participant__solo-identity {
	margin-bottom: 18px;
	padding: 16px;
	background: var(--fls-reg-cream);
	border-radius: var(--fls-reg-radius-small);
}

.fls-registration-participant__solo-identity p {
	margin: 4px 0 0;
}

/*
 * Activités
 */

.fls-registration-activities__participant {
	margin-top: 20px;
}

.fls-registration-activities__participant:first-of-type {
	margin-top: 0;
}

.fls-registration-activities__participant-header {
	display: grid;
	gap: 3px;
	margin-bottom: 18px;
	padding: 16px 18px;
	background: linear-gradient(135deg, var(--fls-reg-purple-soft), var(--fls-reg-cream));
	border-left: 4px solid var(--fls-reg-purple);
	border-radius: 12px;
}

.fls-registration-activities__participant-header h3 {
	margin: 0;
	font-size: clamp(1.2rem, 2vw, 1.45rem);
}

.fls-registration-activities__participant-header p {
	margin: 0;
	color: var(--fls-reg-muted);
}

.fls-registration-activities__participant-position {
	color: var(--fls-reg-purple-dark) !important;
	font-size: 0.8rem;
	font-weight: 750;
	letter-spacing: 0.045em;
	text-transform: uppercase;
}

.fls-registration-activities__participant-age {
	font-size: 0.9rem;
}

.fls-registration-activities__catalog {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
	column-gap: 18px;
	row-gap: 24px;
}

.fls-registration-activities__activity--gym-douce {
	--fls-activity-accent: var(--fls-reg-sage);
	--fls-activity-header: var(--fls-reg-sage-soft);
	--fls-activity-price: var(--fls-reg-success);

	grid-column: 1;
	grid-row: 1;
}

.fls-registration-activities__activity--yoga {
	--fls-activity-accent: #9a83b5;
	--fls-activity-header: #f6f2f9;
	--fls-activity-price: #6f5589;

	grid-column: 2;
	grid-row: 1;
}

.fls-registration-activities__activity--pilates {
	--fls-activity-accent: var(--fls-reg-turquoise);
	--fls-activity-header: var(--fls-reg-turquoise-soft);
	--fls-activity-price: var(--fls-reg-turquoise-dark);

	grid-column: 1 / -1;
	grid-row: 2;
}

.fls-registration-activities__activity--cheerleading {
	--fls-activity-accent: #c69a3a;
	--fls-activity-header: var(--fls-reg-warning-soft);
	--fls-activity-price: var(--fls-reg-warning);

	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
	grid-row: 3;
	column-gap: 24px;
}

.fls-registration-activities__activity--theatre {
	--fls-activity-accent: var(--fls-reg-purple);
	--fls-activity-header: var(--fls-reg-purple-soft);
	--fls-activity-price: var(--fls-reg-purple-dark);

	grid-column: 1 / -1;
	grid-row: 4;
}

.fls-registration-activities__activity {
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 16px 18px;
	background: var(--fls-reg-white);
	border: 1px solid var(--fls-reg-border);
	border-radius: 14px;
	transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.fls-registration-activities__activity-header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 18px;
	margin: -16px -18px 12px;
	padding: 13px 14px 12px;
	background: var(--fls-activity-header, var(--fls-reg-purple-soft));
	border-left: 4px solid var(--fls-activity-accent, var(--fls-reg-purple));
	border-radius: 13px 13px 8px 8px;
}

.fls-registration-activities__activity-header h4 {
	margin: 0;
	color: var(--fls-reg-text);
	font-size: 1.08rem;
	font-weight: 750;
}

.fls-registration-activities__price {
	flex: 0 0 auto;
	color: var(--fls-activity-price, var(--fls-reg-purple-dark));
	font-size: 1.08rem;
}

.fls-registration-activities__advice,
.fls-registration-activities__mandatory-fee {
	margin: 8px 0;
	padding: 8px 11px;
	background: var(--fls-reg-cream);
	border-radius: 8px;
	color: var(--fls-reg-muted);
	font-size: 0.88rem;
	line-height: 1.45;
}

.fls-registration-activities__slots {
	display: grid;
	gap: 10px;
}

.fls-registration-activities__activity--pilates .fls-registration-activities__slots {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fls-registration-activities__activity--theatre .fls-registration-activities__slots {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.fls-registration-activities__activity--cheerleading .fls-registration-activities__activity-header {
	grid-column: 1 / -1;
}

.fls-registration-activities__cheer-information {
	grid-column: 1;
	grid-row: 2 / span 3;
	min-width: 0;
	padding: 5px 14px 5px 12px;
	background: transparent;
	border-left: 2px solid rgba(198, 154, 58, 0.38);
	line-height: 1.5;
	overflow-wrap: anywhere;
}

.fls-registration-activities__cheer-information p {
	margin: 6px 0 0;
	color: var(--fls-reg-muted);
}

.fls-registration-activities__cheer-schedule {
	display: grid;
	gap: 2px;
	margin-top: 12px !important;
}

.fls-registration-activities__cheer-schedule strong {
	margin-bottom: 2px;
	color: var(--fls-reg-text);
}

.fls-registration-activities__activity--cheerleading > .fls-registration-activities__mandatory-fee,
.fls-registration-activities__activity--cheerleading > .fls-registration-activities__activity-choice,
.fls-registration-activities__activity--cheerleading > .fls-registration-activities__remove {
	grid-column: 2;
}

.fls-registration-activities__activity--cheerleading > .fls-registration-activities__mandatory-fee {
	margin-top: 0;
	background: #fffaf0;
}

.fls-registration-activities__activity--cheerleading > .fls-registration-activities__activity-choice {
	align-self: start;
}

.fls-registration-activities__slot {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 11px 12px;
	background: #fdfcfb;
	border: 1px solid var(--fls-reg-border);
	border-radius: 11px;
	cursor: pointer;
	transition:
		border-color 160ms ease,
		background 160ms ease;
}

.fls-registration-activities__slot:hover {
	border-color: #c8b7d2;
	background: var(--fls-reg-cream);
}

.fls-registration-activities__slot:has(input:checked) {
	background: var(--fls-activity-header, var(--fls-reg-purple-soft));
	border-color: var(--fls-activity-accent, var(--fls-reg-purple));
	box-shadow: inset 0 0 0 1px var(--fls-activity-accent, var(--fls-reg-purple));
}

.fls-registration-activities__slot input {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: 2px;
	accent-color: var(--fls-activity-accent, var(--fls-reg-purple));
}

.fls-registration-activities__slot-content {
	display: grid;
	min-width: 0;
	gap: 3px;
}

.fls-registration-activities__slot-content > span {
	color: var(--fls-reg-muted);
	font-size: 0.9rem;
	overflow-wrap: anywhere;
}

.fls-registration-activities__slot--disabled {
	opacity: 0.62;
	cursor: not-allowed;
}

.fls-registration-activities__activity-choice {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin-top: 10px;
	padding: 12px;
	background: #fdfcfb;
	border: 1px solid var(--fls-reg-border);
	border-radius: 10px;
	cursor: pointer;
}

.fls-registration-activities__activity-choice:has(input:checked) {
	background: var(--fls-activity-header, var(--fls-reg-purple-soft));
	border-color: var(--fls-activity-accent, var(--fls-reg-purple));
	box-shadow: inset 0 0 0 1px var(--fls-activity-accent, var(--fls-reg-purple));
}

.fls-registration-activities__activity-choice input {
	width: 19px;
	height: 19px;
	margin-top: 2px;
	accent-color: var(--fls-activity-accent, var(--fls-reg-purple));
}

.fls-registration-activities__activity-choice-content {
	display: grid;
	gap: 3px;
}

.fls-registration-activities__activity-choice-content > span {
	color: var(--fls-reg-muted);
	font-size: 0.9rem;
}

.fls-registration-activities__slot:focus-within,
.fls-registration-activities__activity-choice:focus-within {
	outline: 3px solid rgba(0, 140, 163, 0.24);
	outline-offset: 2px;
}

.fls-registration-activities__remove {
	display: flex;
	justify-content: flex-end;
	margin-top: 12px;
}

.fls-registration-activities__activity:not(:has(input:checked)) > .fls-registration-activities__remove {
	display: none;
}

.fls-registration-activities__remove-button {
	min-height: 34px !important;
	padding: 6px 10px !important;
	color: var(--fls-reg-danger) !important;
	background: transparent !important;
	border-color: transparent !important;
	font-size: 0.88rem !important;
}

.fls-registration-activities__remove-button:hover {
	background: var(--fls-reg-danger-soft) !important;
	border-color: #e0bcbc !important;
	box-shadow: none !important;
	transform: none !important;
}

/*
 * Messages
 */

.fls-registration-notice {
	margin: 0 0 20px;
	padding: 14px 16px;
	border: 1px solid transparent;
	border-radius: 12px;
}

.fls-registration-notice strong {
	display: block;
	margin-bottom: 3px;
}

.fls-registration-notice p {
	margin: 0;
}

.fls-registration-notice--success {
	color: var(--fls-reg-success);
	background: var(--fls-reg-success-soft);
	border-color: #c9ddcd;
}

.fls-registration-notice--warning {
	color: var(--fls-reg-warning);
	background: var(--fls-reg-warning-soft);
	border-color: #ead8a6;
}

.fls-registration-notice--error {
	color: var(--fls-reg-danger);
	background: var(--fls-reg-danger-soft);
	border-color: #ebc2c2;
}

/*
 * Wizard
 */

/*
 * Une seule étape est visible à la fois.
 *
 * L'étape courante est déterminée côté PHP puis transmise
 * dans data-fls-current-step.
 */

.fls-registration-wizard__main > .fls-registration-path,
.fls-registration-wizard__main > .fls-registration-household,
.fls-registration-wizard__main > .fls-registration-participant,
.fls-registration-wizard__main > .fls-registration-activities {
	display: none;
}

.fls-registration-wizard[data-fls-current-step="1"]
	.fls-registration-path {
	display: block;
}

.fls-registration-wizard[data-fls-current-step="2"]
	.fls-registration-household {
	display: block;
}

.fls-registration-wizard[data-fls-current-step="3"]
	.fls-registration-participant {
	display: block;
}

.fls-registration-wizard[data-fls-current-step="4"]
	.fls-registration-activities {
	display: block;
}

.fls-registration-wizard {
	box-sizing: border-box;

	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 32px;

	width: 100%;
	max-width: 1500px;
	margin: 48px auto 0;
	padding-right: clamp(24px, 3vw, 48px);
	padding-left: clamp(24px, 3vw, 48px);
}

.fls-registration-wizard__main {
	flex: 1 1 0;
	min-width: 0;
}

.fls-registration-wizard__summary {
	flex: 0 0 280px;

	position: sticky;
	top: 30px;

	padding: 22px;

	background: var(--fls-reg-white);
	border: 1px solid var(--fls-reg-border);
	border-radius: var(--fls-reg-radius);
	box-shadow: var(--fls-reg-shadow);
}

.fls-registration-wizard__summary-title {
	margin: 0 0 18px;
	font-size: 1.15rem;
}

.fls-registration-wizard__summary-kicker {
	margin: 0 0 5px;
	color: var(--fls-reg-purple-dark);
	font-size: 0.78rem;
	font-weight: 750;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.fls-registration-progress__item.is-locked {
	opacity: 0.52;
}

.fls-registration-progress__item.is-available:not(.is-current) {
	opacity: 0.78;
}

.fls-registration-progress__item.is-complete
	.fls-registration-progress__label {
	color: var(--fls-reg-success);
}

.fls-registration-progress__item.is-current
	.fls-registration-progress__label {
	color: var(--fls-reg-purple-dark);
}

.fls-registration-progress__edit:hover {
	color: var(--fls-reg-purple);
	text-decoration: underline;
}

.fls-registration-progress {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fls-registration-progress__item {
	position: relative;
	padding: 0 0 20px 34px;
}

.fls-registration-progress__item:last-child {
	padding-bottom: 0;
}

.fls-registration-progress__item::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 7px;
	width: 12px;
	height: 12px;
	background: var(--fls-reg-white);
	border: 2px solid #cfc7d1;
	border-radius: 50%;
}

.fls-registration-progress__item::after {
	content: "";
	position: absolute;
	top: 19px;
	bottom: 0;
	left: 12px;
	width: 2px;
	background: var(--fls-reg-border);
}

.fls-registration-progress__item:last-child::after {
	display: none;
}

.fls-registration-progress__item.is-complete::before {
	background: var(--fls-reg-sage);
	border-color: var(--fls-reg-sage);
}

.fls-registration-progress__item.is-current::before {
	background: var(--fls-reg-purple);
	border-color: var(--fls-reg-purple);
	box-shadow: 0 0 0 4px var(--fls-reg-purple-soft);
}

.fls-registration-progress__label {
	display: block;
	font-weight: 700;
}

.fls-registration-progress__preview {
	display: block;
	margin-top: 3px;

	color: var(--fls-reg-muted);

	font-size: 0.88rem;
	line-height: 1.4;

	overflow-wrap: anywhere;
}

.fls-registration-progress__edit {
	display: inline-flex;
	align-items: center;
	margin-top: 6px;

	color: var(--fls-reg-muted);
	font-size: 0.82rem;
	font-weight: 650;
	text-decoration: none;

	transition:
		color 150ms ease,
		opacity 150ms ease;
}
/*
 * Navigation du tunnel
 */

.fls-registration-wizard__navigation {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;

	width: 100%;
	margin: 4px 0 28px;
	padding: 0 4px;
}

.fls-registration-wizard__navigation-back,
.fls-registration-wizard__navigation-next {
	display: flex;
	align-items: center;
}

.fls-registration-wizard__navigation-next {
	justify-content: flex-end;
	margin-left: auto;
}

.fls-registration-wizard__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;

	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;

	border-radius: 10px;

	transition:
		color 160ms ease,
		background 160ms ease,
		border-color 160ms ease,
		transform 160ms ease,
		box-shadow 160ms ease;
}

.fls-registration-wizard__button--secondary {
	padding: 10px 8px;

	color: var(--fls-reg-purple-dark);
	background: transparent;
	border: 1px solid transparent;
}

.fls-registration-wizard__button--secondary::before {
	content: "←";
	margin-right: 8px;
	font-size: 1.05em;
}

.fls-registration-wizard__button--secondary:hover {
	color: var(--fls-reg-purple);
	background: var(--fls-reg-purple-soft);
	text-decoration: none;
}

.fls-registration-wizard__button--primary {
    padding: 11px 20px;
    color: var(--fls-reg-white);
	background: var(--fls-reg-turquoise);
    border: 1px solid var(--fls-reg-turquoise);
    box-shadow: 0 6px 16px rgba(0, 111, 130, 0.14);
}

.fls-registration-wizard__button--primary::after {
	content: "→";
	margin-left: 9px;
	font-size: 1.05em;
}

.fls-registration-wizard__button--primary:hover {
    color: var(--fls-reg-white);
    background: var(--fls-reg-turquoise-dark);
    border-color: var(--fls-reg-turquoise-dark);
    box-shadow: 0 8px 20px rgba(0, 111, 130, 0.2);
    transform: translateY(-1px);
    text-decoration: none;
}

.fls-registration-wizard__button:focus-visible {
	outline: 3px solid rgba(117, 90, 143, 0.24);
	outline-offset: 3px;
}
.fls-registration-wizard__button--primary:focus-visible {
    outline-color: rgba(0, 140, 163, 0.3);
}

/*
 * Responsive
 */

/*
 * Récapitulatif et paiement
 */

.fls-registration-summary__header {
	margin-bottom: 22px;
}

.fls-registration-summary__header h2 {
	margin: 6px 0 8px;
	font-size: clamp(1.55rem, 2vw, 2rem);
}

.fls-registration-summary__header > p:last-child,
.fls-registration-summary__item span {
	color: var(--fls-reg-muted);
}

.fls-registration-summary__step {
	display: inline-flex;
	margin: 0;
	padding: 6px 11px;
	color: var(--fls-reg-purple-dark);
	background: var(--fls-reg-purple-soft);
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 700;
}

.fls-registration-summary__household,
.fls-registration-summary__participant {
	margin-bottom: 18px;
	padding: 20px;
	background: var(--fls-reg-cream);
	border: 1px solid var(--fls-reg-border);
	border-radius: var(--fls-reg-radius-small);
}

.fls-registration-summary h3 {
	margin: 0 0 12px;
}

.fls-registration-summary__household p {
	margin: 0;
	line-height: 1.6;
}

.fls-registration-summary__item,
.fls-registration-summary__participant-total,
.fls-registration-summary__grand-total {
	display: flex;
	justify-content: space-between;
	gap: 20px;
}

.fls-registration-summary__item {
	padding: 14px 0;
	border-top: 1px solid var(--fls-reg-border);
}

.fls-registration-summary__item:first-child {
	padding-top: 0;
	border-top: 0;
}

.fls-registration-summary__item > div:first-child span,
.fls-registration-summary__amounts span {
	display: block;
	margin-top: 3px;
}

.fls-registration-summary__amounts {
	min-width: 190px;
	text-align: right;
}

.fls-registration-summary__participant-total {
	padding-top: 10px;
	border-top: 1px solid var(--fls-reg-border);
}

.fls-registration-summary__participant-total--strong {
	margin-top: 10px;
	font-size: 1.08rem;
}

.fls-registration-summary__grand-total {
	align-items: center;
	margin: 24px 0;
	padding: 20px;
	color: var(--fls-reg-turquoise-dark);
	background: var(--fls-reg-turquoise-soft);
	border-radius: var(--fls-reg-radius-small);
	font-size: 1.25rem;
}

.fls-registration-summary__grand-total strong {
	font-size: 1.55rem;
}

.fls-registration-summary__checkout {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.fls-registration-summary__checkout button {
	min-height: 50px;
	padding: 12px 22px;
	border-radius: 10px;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.fls-registration-summary__pay-online {
	color: var(--fls-reg-white);
	background: var(--fls-reg-turquoise);
	border: 1px solid var(--fls-reg-turquoise);
}

.fls-registration-summary__pay-online:hover {
	background: var(--fls-reg-turquoise-dark);
}

.fls-registration-summary__pay-later {
	color: var(--fls-reg-purple-dark);
	background: var(--fls-reg-white);
	border: 1px solid var(--fls-reg-purple);
}

.fls-registration-summary__back {
	display: inline-block;
	margin-top: 18px;
}

@media (max-width: 1100px) {
	.fls-registration-wizard {
		display: block;

		width: 100%;
		margin-top: 32px;
		padding-right: 24px;
		padding-left: 24px;
	}

	.fls-registration-wizard__main {
		width: 100%;
	}

	.fls-registration-wizard__summary {
		display: none;
	}

	.fls-registration-path__options {
		grid-template-columns: 1fr;
	}
}
@media (max-width: 900px) {
	.fls-registration-activities__activity--cheerleading {
		grid-template-columns: minmax(0, 1fr) minmax(240px, 0.8fr);
		column-gap: 16px;
	}

	.fls-registration-participant__row--identity {
		grid-template-columns:
			minmax(0, 1fr)
			minmax(0, 1fr);
	}

	.fls-registration-participant__field--birth-date {
		width: 190px;
	}
}

@media (max-width: 700px) {
	.fls-registration-activities__catalog {
		grid-template-columns: minmax(0, 1fr);
	}

	.fls-registration-activities__activity--gym-douce,
	.fls-registration-activities__activity--yoga,
	.fls-registration-activities__activity--pilates,
	.fls-registration-activities__activity--cheerleading,
	.fls-registration-activities__activity--theatre {
		grid-column: 1;
	}

	.fls-registration-activities__activity--gym-douce {
		grid-row: 1;
	}

	.fls-registration-activities__activity--yoga {
		grid-row: 2;
	}

	.fls-registration-activities__activity--pilates {
		grid-row: 3;
	}

	.fls-registration-activities__activity--cheerleading {
		grid-row: 4;
	}

	.fls-registration-activities__activity--theatre {
		grid-row: 5;
	}

	.fls-registration-activities__activity--cheerleading {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 10px;
	}

	.fls-registration-activities__activity--cheerleading .fls-registration-activities__activity-header,
	.fls-registration-activities__cheer-information,
	.fls-registration-activities__activity--cheerleading > .fls-registration-activities__mandatory-fee,
	.fls-registration-activities__activity--cheerleading > .fls-registration-activities__activity-choice,
	.fls-registration-activities__activity--cheerleading > .fls-registration-activities__remove {
		grid-column: 1;
		grid-row: auto;
	}

	.fls-registration-activities__activity--pilates .fls-registration-activities__slots,
	.fls-registration-activities__activity--theatre .fls-registration-activities__slots {
		grid-template-columns: minmax(0, 1fr);
	}

	.fls-registration-household__row,
	.fls-registration-participant__row {
		grid-template-columns: 1fr;
		gap: 0;
	}
	.fls-registration-participant__field--birth-date {
		width: 100%;
	}

	.fls-registration-participant__field--birth-date input[type="date"] {
		width: 100%;
	}
}

@media (max-width: 600px) {
	.fls-registration-wizard {
		margin-top: 24px;
		padding-right: 14px;
		padding-left: 14px;
	}

	.fls-registration-login,
	.fls-registration-path,
	.fls-registration-household,
	.fls-registration-participant,
	.fls-registration-activities,
	.fls-registration-summary {
		padding: 20px 16px;
		border-radius: 14px;
	}

	.fls-registration-login__form {
		max-width: none;
	}

	.fls-registration-login__actions {
		align-items: stretch;
		flex-direction: column;
	}

	.fls-registration-login__actions button {
		width: 100%;
		min-height: 48px;
	}

	.fls-registration-login__actions a {
		align-self: center;
		padding: 4px;
		text-align: center;
	}

	.fls-registration-participant__card {
		align-items: flex-start;
		flex-direction: column;
	}

	.fls-registration-participant__card-actions {
		width: 100%;
		gap: 10px;
	}

	.fls-registration-participant__card-actions form {
		flex: 1 1 0;
		height: 40px;
	}

	.fls-registration-participant__card-actions button {
		width: 100%;
		min-width: 0;
		height: 40px;
	}

	.fls-registration-path__actions,
	.fls-registration-household__actions,
	.fls-registration-participant__actions,
	.fls-registration-activities__actions {
		align-items: stretch;
		flex-direction: column;
	}

	.fls-registration-path__actions button,
	.fls-registration-household__actions button,
	.fls-registration-participant__actions button,
	.fls-registration-activities__actions button {
		width: 100%;
	}

	.fls-registration-activities__participant-header,
	.fls-registration-activities__activity {
		padding: 14px;
	}

	.fls-registration-activities__activity-header {
		align-items: baseline;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 4px 12px;
		margin: -14px -14px 12px;
		padding: 12px 10px 11px;
	}

	.fls-registration-participant__actions > a {
		justify-content: center;
	}

	.fls-registration-wizard__navigation {
		flex-direction: column;
		align-items: stretch;

		gap: 10px;

		width: 100%;
		margin: 10px 0 34px;
		padding: 0;
	}

	.fls-registration-wizard__navigation-next {
		order: 1;

		width: 100%;
		margin-left: 0;
	}

	.fls-registration-wizard__navigation-back {
		order: 2;

		justify-content: center;
		width: 100%;
	}

	.fls-registration-wizard__button--primary {
		width: 100%;
		min-height: 48px;
	}

	.fls-registration-wizard__button--secondary {
		min-height: 44px;
		padding: 10px 16px;
	}

	.fls-registration-summary__item,
	.fls-registration-summary__checkout {
		align-items: stretch;
		flex-direction: column;
	}

	.fls-registration-summary__amounts {
		min-width: 0;
		text-align: left;
	}

	.fls-registration-summary__checkout button {
		width: 100%;
	}
}