/* ==========================================================================
   CCPA – FAQ
   Reprend les codes du thème : GadegBold, Montserrat, arrondis 20px,
   palette violet #56509D / prune #672254 / vert #25AE7E / orange #F0553D.
   ========================================================================== */

.ccpa-faq {
	--faq-couleur: #56509D;   /* fond de la question */
	--faq-survol: #672254;    /* fond au survol / focus */
	--faq-texte: #FFFFFF;     /* texte de la question */
	--faq-lien: #672254;      /* liens dans la réponse */
	--faq-rayon: 20px;
	margin: 30px 0;
}

/* Variantes de couleur : [faq cat="…" couleur="…"] */
.ccpa-faq--prune {
	--faq-couleur: #672254;
	--faq-survol: #56509D;
}
.ccpa-faq--vert {
	/* Vert du thème (#25AE7E) légèrement assombri : le texte blanc atteint le contraste AA (4,6:1). */
	--faq-couleur: #1B8560;
	--faq-survol: #672254;
}
.ccpa-faq--orange {
	--faq-couleur: #F0553D;
	--faq-survol: #672254;
}

/* --- Titre de catégorie : réutilise h2.stylise (pictogramme du thème) -- */
.ccpa-faq__groupe + .ccpa-faq__groupe {
	margin-top: 50px;
}
.ccpa-faq h2.ccpa-faq__titre {
	color: #672254;
	margin: 0 0 20px 29px; /* place pour le pictogramme positionné à gauche */
	line-height: 1.15;
}

/* --- Liste --------------------------------------------------------------- */
.ccpa-faq__liste {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* --- Question (bloc arrondi sur fond coloré) ---------------------------- */
.ccpa-faq__item {
	margin: 0;
	background: var(--faq-couleur);
	border: 2px solid var(--faq-couleur);
	border-radius: var(--faq-rayon);
	overflow: hidden;
	transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
.ccpa-faq__item:has(> .ccpa-faq__question:hover),
.ccpa-faq__item:has(> .ccpa-faq__question:focus-visible) {
	background: var(--faq-survol);
	border-color: var(--faq-survol);
}
.ccpa-faq__item[open] {
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}

.ccpa-faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 18px 20px 18px 26px;
	cursor: pointer;
	list-style: none;
	color: var(--faq-texte);
	font-family: 'GadegBold', 'Montserrat', sans-serif;
	font-weight: normal;
	font-size: 20px;
	line-height: 1.3;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}
.ccpa-faq__question::-webkit-details-marker {
	display: none;
}
.ccpa-faq__question::marker {
	content: '';
}
.ccpa-faq__question:focus {
	outline: none;
}
.ccpa-faq__question:focus-visible {
	outline: 3px solid #FBBB21;
	outline-offset: -5px;
	border-radius: calc(var(--faq-rayon) - 2px);
}

/* Pastille blanche + chevron (tourne à l'ouverture) */
.ccpa-faq__icone {
	position: relative;
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	background: #FFFFFF;
	border-radius: 50%;
	transition: transform 0.3s ease-out;
}
.ccpa-faq__icone::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 9px;
	height: 9px;
	margin: -7px 0 0 -5px;
	border-right: 3px solid var(--faq-couleur);
	border-bottom: 3px solid var(--faq-couleur);
	transform: rotate(45deg);
	transition: border-color 0.2s ease-in-out;
}
.ccpa-faq__question:hover .ccpa-faq__icone::before,
.ccpa-faq__question:focus-visible .ccpa-faq__icone::before {
	border-color: var(--faq-survol);
}
.ccpa-faq__item[open] .ccpa-faq__icone {
	transform: rotate(180deg);
}

/* --- Réponse (fond blanc, encadrée par la couleur) ---------------------- */
.ccpa-faq__reponse {
	overflow: hidden;
	background: #FFFFFF;
	border-radius: 0 0 calc(var(--faq-rayon) - 2px) calc(var(--faq-rayon) - 2px);
}
.ccpa-faq__reponse-inner {
	padding: 22px 26px 24px;
	color: #2E2E2E;
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	line-height: 1.6;
}
.ccpa-faq__reponse-inner > :first-child {
	margin-top: 0;
}
.ccpa-faq__reponse-inner > :last-child {
	margin-bottom: 0;
}
.ccpa-faq__reponse-inner p {
	margin: 0 0 12px;
}
.ccpa-faq__reponse-inner a {
	color: var(--faq-lien);
	font-weight: 500;
	text-decoration: underline;
}
.ccpa-faq__reponse-inner a:hover,
.ccpa-faq__reponse-inner a:focus {
	color: #F0553D;
	font-weight: 500;
	text-decoration: underline;
}
.ccpa-faq__reponse-inner h2,
.ccpa-faq__reponse-inner h3,
.ccpa-faq__reponse-inner h4 {
	margin: 20px 0 10px;
	color: #672254;
	font-size: 18px !important; /* le thème force h2 à 40px */
	line-height: 1.3;
}
.ccpa-faq__reponse-inner h2::before {
	display: none; /* pas de pictogramme dans les réponses */
}
.ccpa-faq__reponse-inner img {
	border-radius: 12px;
}
.ccpa-faq__reponse-inner ul,
.ccpa-faq__reponse-inner ol {
	margin: 0 0 12px;
}

/* --- Mobile ------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
	.ccpa-faq h2.ccpa-faq__titre {
		font-size: 30px !important;
	}
	.ccpa-faq__question {
		gap: 14px;
		padding: 15px 14px 15px 18px;
		font-size: 19px;
	}
	.ccpa-faq__icone {
		flex-basis: 30px;
		width: 30px;
		height: 30px;
	}
	.ccpa-faq__icone::before {
		width: 8px;
		height: 8px;
		margin: -6px 0 0 -5px;
	}
	.ccpa-faq__reponse-inner {
		padding: 18px 18px 20px;
		font-size: 15px;
	}
}

/* --- Animations désactivées si l'utilisateur le demande ----------------- */
@media (prefers-reduced-motion: reduce) {
	.ccpa-faq__item,
	.ccpa-faq__icone,
	.ccpa-faq__icone::before {
		transition: none;
	}
}

/* --- Mode contraste du thème (html.dark : bleu / jaune) ----------------- */
html.dark .ccpa-faq__item,
html.dark .ccpa-faq__question,
html.dark .ccpa-faq__reponse,
html.dark .ccpa-faq__reponse-inner {
	background: blue !important;
	color: yellow !important;
}
html.dark .ccpa-faq__item {
	border-color: yellow !important;
	box-shadow: none !important;
}
html.dark .ccpa-faq__reponse {
	border-top: 2px solid yellow;
}
html.dark .ccpa-faq__icone {
	background: blue !important;
	border: 2px solid yellow;
}
html.dark .ccpa-faq__icone::before {
	border-color: yellow !important;
}
html.dark .ccpa-faq h2.ccpa-faq__titre {
	color: yellow !important;
}

/* --- Impression : toutes les réponses visibles --------------------------- */
@media print {
	.ccpa-faq__item {
		background: none;
		border-color: #999;
		box-shadow: none;
		break-inside: avoid;
	}
	.ccpa-faq__question {
		color: #000;
	}
	.ccpa-faq__icone {
		display: none;
	}
}
