/*
 * ZAA FAQ — styles front + éditeur.
 * Volontairement MINIMAL : le plugin ne fournit que l'indicateur « + / − »
 * de l'accordéon (et le nécessaire pour rendre la question cliquable).
 * Toute l'apparence (bordures, fonds, typographie, espacements) appartient
 * au thème hôte, qui peut cibler .wp-block-zaa-faq-faq / .wp-block-zaa-faq-item.
 */

/* Question cliquable, sans le marqueur triangulaire natif du <details>. */
.zaa-faq-item__question {
	cursor: pointer;
	position: relative;
	padding-right: 2em; /* espace réservé à l'indicateur */
	list-style: none;
}

.zaa-faq-item__question::-webkit-details-marker {
	display: none;
}

/* Indicateur « + / − » : deux barres, la verticale pivote à l'ouverture. */
details.wp-block-zaa-faq-item > .zaa-faq-item__question::before,
details.wp-block-zaa-faq-item > .zaa-faq-item__question::after {
	content: '';
	position: absolute;
	right: 0.5em;
	top: 50%;
	width: 0.8em;
	height: 2px;
	background-color: currentColor;
	transition: transform 0.2s ease, background-color 0.2s ease;
}

details.wp-block-zaa-faq-item > .zaa-faq-item__question::before {
	transform: translateY( -50% );                 /* barre horizontale */
}

details.wp-block-zaa-faq-item > .zaa-faq-item__question::after {
	transform: translateY( -50% ) rotate( 90deg ); /* barre verticale → forme le + */
}

details.wp-block-zaa-faq-item[open] > .zaa-faq-item__question::after {
	transform: translateY( -50% ) rotate( 0deg );  /* ouvert : − */
}

/* Éditeur : la question est un div (pas d'indicateur), curseur texte. */
.wp-block-zaa-faq-item div.zaa-faq-item__question {
	cursor: text;
}