/* APERMIS Accompagnateurs — styles J1 (mobile-first, ne consomme que les tokens --ap-* du thème v3,
   avec replis si le thème v2 est actif). Le branding ENSEMBLE différencié arrive en J3. */

.apacc-card {
	background: var(--ap-white, #fff);
	border-radius: var(--ap-r-card, 16px);
	box-shadow: var(--ap-shadow-float, 0 2px 14px rgba(20, 59, 92, 0.10));
	padding: var(--ap-s-6, 24px);
	margin: var(--ap-s-6, 24px) auto;
	max-width: 560px;
}

.apacc-card h2 {
	margin-top: 0;
	color: var(--ap-marine, #143B5C);
}

.apacc-card label {
	display: block;
	font-weight: 600;
	margin-bottom: 6px;
	color: var(--ap-ink, #20303F);
}

.apacc-card input[type="email"] {
	display: block;
	width: 100%;
	box-sizing: border-box;
	font-size: 16px; /* évite le zoom iOS */
	padding: 14px;
	border: 1px solid var(--ap-muted, #6F6A5F);
	border-radius: var(--ap-r-field, 10px);
	margin-bottom: var(--ap-s-4, 16px);
}

.apacc-btn {
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	background: var(--ap-corail, #F0633C);
	color: #fff;
	font-weight: 700;
	font-size: 1.1875rem; /* 19px — règle AA du design system : texte sur corail = blanc ≥ 19px gras */
	padding: 14px 20px;
	border: 0;
	border-radius: var(--ap-r-btn, 999px);
	cursor: pointer;
	text-decoration: none;
}

.apacc-btn:hover,
.apacc-btn:focus {
	background: var(--ap-corail-d, #D9532E);
	color: #fff;
}

.apacc-link {
	color: var(--ap-marine, #143B5C);
	text-decoration: underline;
}

button.apacc-link {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	cursor: pointer;
}

.apacc-hp {
	position: absolute !important;
	left: -9999px !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.apacc-notice {
	max-width: 560px;
	margin: var(--ap-s-4, 16px) auto 0;
	padding: 12px 16px;
	border-radius: var(--ap-r-field, 10px);
	background: var(--ap-warn-bg, #FBF0D9);
	color: var(--ap-ink, #20303F);
}

.apacc-legal {
	font-size: 0.875rem;
	color: var(--ap-muted, #6F6A5F);
	border-top: 1px solid var(--ap-cream, #F7F1E6);
	padding-top: 12px;
	margin-top: 16px;
}

.apacc-refcode {
	font-size: 1.6em;
	font-weight: 800;
	letter-spacing: 2px;
	color: var(--ap-marine, #143B5C);
	background: var(--ap-cream, #F7F1E6);
	border-radius: var(--ap-r-field, 10px);
	padding: 12px 16px;
	text-align: center;
}

#apacc-login-msg:empty {
	display: none;
}

#apacc-login-msg {
	margin: var(--ap-s-3, 12px) 0 0;
	font-weight: 600;
}

/* Encart ENSEMBLE : différenciation légère en J1 (branding complet en J3). */
.apacc-ensemble {
	border-left: 6px solid var(--ap-teal, #1F9D8F);
	background: var(--ap-cream, #F7F1E6);
}

/* ---- J2 : formulaire d'inscription multi-étapes + espaces ---- */

.apacc-reg input[type="text"],
.apacc-reg input[type="tel"],
.apacc-reg input[type="date"],
.apacc-reg input[type="file"],
.apacc-reg select,
.apacc-inline-form input[type="text"],
.apacc-inline-form input[type="date"],
.apacc-inline-form input[type="time"],
.apacc-inline-form select {
	display: block;
	width: 100%;
	box-sizing: border-box;
	font-size: 16px;
	padding: 12px;
	border: 1px solid var(--ap-muted, #6F6A5F);
	border-radius: var(--ap-r-field, 10px);
	margin-bottom: var(--ap-s-4, 16px);
	background: #fff;
}

.apacc-reg fieldset {
	border: 0;
	padding: 0;
	margin: 0;
}

.apacc-reg legend {
	font-weight: 700;
	font-size: 1.25rem;
	color: var(--ap-marine, #143B5C);
	margin-bottom: var(--ap-s-4, 16px);
}

.apacc-steps {
	display: flex;
	gap: 8px;
	margin-bottom: var(--ap-s-4, 16px);
}

.apacc-step {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 14px;
	background: var(--ap-cream, #F7F1E6);
	color: var(--ap-muted, #6F6A5F);
}

.apacc-step.is-on {
	background: var(--ap-marine, #143B5C);
	color: #fff;
}

.apacc-2col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

@media (max-width: 480px) {
	.apacc-2col {
		grid-template-columns: 1fr;
		gap: 0;
	}
}

.apacc-help {
	font-size: 0.9375rem;
	color: var(--ap-muted, #6F6A5F);
}

.apacc-consent label {
	font-weight: 400;
	font-size: 0.9375rem;
	display: block;
}

.apacc-consent input {
	margin-right: 8px;
}

.apacc-back {
	display: block;
	margin: 12px auto 0;
	background: none;
	border: 0;
	cursor: pointer;
	text-decoration: underline;
	color: var(--ap-marine, #143B5C);
}

.apacc-success {
	font-weight: 700;
	color: var(--ap-success, #1E7B45);
}

.apacc-status,
.apacc-doclist {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--ap-s-4, 16px);
}

.apacc-status li,
.apacc-doclist li {
	padding: 8px 0;
	border-bottom: 1px solid var(--ap-cream, #F7F1E6);
}

.apacc-btn-sm {
	width: auto;
	font-size: 1rem;
	padding: 8px 14px;
	margin-left: 8px;
}

/* C4 — Pochette contrôle : présence / absence d'une pièce au dossier.
   Jamais la couleur seule : le glyphe (✔ / ●) porte l'information (AA). */
.apacc-ok {
	color: #1F6B3A;
	font-weight: 700;
}

.apacc-missing {
	color: var(--ap-corail-text, #B84624);
	font-weight: 700;
}

.apacc-inline-form {
	margin-top: var(--ap-s-4, 16px);
}

#apacc-reg-msg,
#apacc-addlearner-msg,
#apacc-respond-msg,
#ens-msg,
#ens-join-msg,
#ens-offer-msg {
	font-weight: 600;
}

#apacc-reg-msg:empty,
#apacc-addlearner-msg:empty,
#apacc-respond-msg:empty,
#ens-msg:empty,
#ens-join-msg:empty,
#ens-offer-msg:empty {
	display: none;
}

/* ---- J3 : identité visuelle ENSEMBLE (séparation A5 — palette teal, wordmark dédié) ---- */

.ens-brand {
	display: flex;
	align-items: baseline;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--ap-teal, #1F9D8F);
}

.ens-wordmark {
	font-weight: 800;
	letter-spacing: 3px;
	/* --ap-teal est réservé au décor (2,97:1) — le texte utilise le vert AA du design system. */
	color: var(--ap-success, #14655B);
	font-size: 1.25rem;
}

.ens-brand-lg .ens-wordmark {
	font-size: 1.9rem;
}

.ens-tag {
	font-size: 0.8125rem;
	color: var(--ap-muted, #6F6A5F);
	text-transform: uppercase;
	letter-spacing: 1px;
}

.ens-hero {
	max-width: 560px;
	margin: var(--ap-s-6, 24px) auto 0;
	padding: var(--ap-s-6, 24px);
	background: var(--ap-success-bg, #E2F0EC);
	border-radius: var(--ap-r-card, 16px);
	border-left: 6px solid var(--ap-teal, #1F9D8F);
}

.ens-lede {
	font-size: 1.0625rem;
	margin: 0;
}

.ens-steps li {
	margin-bottom: 10px;
}

.ens-btn {
	/* Fond AA (blanc sur #14655B = 6,8:1) — le teal décoratif ne porte jamais de texte. */
	background: var(--ap-success, #14655B);
}

.ens-btn:hover,
.ens-btn:focus {
	background: #0F4E46;
}

.ens-btn-neutral {
	background: var(--ap-white, #fff);
	color: var(--ap-marine, #143B5C);
	border: 2px solid var(--ap-marine, #143B5C);
}

.ens-btn-neutral:hover,
.ens-btn-neutral:focus {
	background: var(--ap-cream, #F7F1E6);
	color: var(--ap-marine, #143B5C);
}

/* Les deux réponses à la proposition solidaire (spec §8) : STRICTEMENT le même style —
   mêmes dimensions, même couleur, même traitement. Aucune hiérarchie primaire/secondaire. */
.ens-btn-choice {
	background: var(--ap-white, #fff);
	color: var(--ap-marine, #143B5C);
	border: 2px solid var(--ap-marine, #143B5C);
}

.ens-btn-choice:hover,
.ens-btn-choice:focus {
	background: var(--ap-cream, #F7F1E6);
	color: var(--ap-marine, #143B5C);
}

.ens-choice {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-top: 12px;
}

@media (max-width: 480px) {
	.ens-choice {
		grid-template-columns: 1fr;
	}
}

.ens-charte-details summary {
	cursor: pointer;
	font-weight: 700;
	color: var(--ap-marine, #143B5C);
}

.apacc-charte h3 {
	margin-top: 16px;
}

.apacc-charte h4 {
	margin: 16px 0 6px;
	color: var(--ap-marine, #143B5C);
}

.ens-section h4 {
	margin: 20px 0 8px;
	color: var(--ap-marine, #143B5C);
}

/* ---- J2.1 : informations lues sur les documents (lecture seule) */
.apacc-extract {
	margin: 14px 0;
	padding: 12px 14px;
	border: 1px solid var(--ap-sable-d, #E4DCC8);
	border-radius: 10px;
	background: var(--ap-creme, #FBF7EE);
}

.apacc-extract-list {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 4px 14px;
	margin: 8px 0;
}

.apacc-extract-list dt {
	color: var(--ap-muted, #6F6A5F);
	font-size: 0.9em;
}

.apacc-extract-list dd {
	margin: 0;
	font-weight: 700;
	color: var(--ap-marine, #143B5C);
}
