/* Avis apprenants — styles isolés (préfixe .aa-)
   Repris du carrousel Divi de lesfoliweb.fr. Les couleurs se changent ici. */
.aa-module {
	--aa-accent: #ed695f;      /* corail : société, filtre actif */
	--aa-blue: #82cde4;        /* contour des photos */
	--aa-star: #fab523;
	--aa-ink: #1c1b1a;
	--aa-muted: #6e6e73;
	--aa-card-bg: #f5f5f5;
	--aa-card-border: #333333;
	--aa-arrow: #333333;
	--aa-gap: 20px;
	font-family: inherit;
	color: var(--aa-ink);
	box-sizing: border-box;
	width: 100%;
}
/* largeur du carrousel sur lesfoliweb.fr (sélecteur renforcé pour passer devant les thèmes) */
div.aa-module.aa-module { max-width: 1140px !important; margin-left: auto !important; margin-right: auto !important; }
.aa-module *, .aa-module *::before, .aa-module *::after { box-sizing: border-box; }
.aa-module p { padding: 0; }

/* ---------- Filtres (page « Nos apprenants ») ---------- */
.aa-filters {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
	padding: 24px 26px;
	margin: 0 0 40px;
}
.aa-filters-title {
	display: flex; align-items: center; gap: 8px;
	font-weight: 700; font-size: 14px; color: var(--aa-ink);
	margin: 0 0 14px !important;
}
.aa-filters-title svg { color: var(--aa-accent); flex: none; }
.aa-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.aa-chip {
	appearance: none;
	font: inherit; font-size: 14px; font-weight: 600; line-height: 1.2;
	min-height: 44px; padding: 10px 22px;
	border: 1.5px solid #d9d7d0; border-radius: 999px;
	background: #fff; color: var(--aa-ink);
	cursor: pointer;
	transition: background .2s, border-color .2s, color .2s;
}
.aa-chip:hover { border-color: var(--aa-accent); }
/* filtre sélectionné : fond corail, texte blanc */
.aa-chip.is-active { background: var(--aa-accent); border-color: var(--aa-accent); color: #ffffff; font-weight: 700; }
.aa-chip:focus-visible, .aa-arrow:focus-visible, .aa-module a:focus-visible { outline: 3px solid var(--aa-blue); outline-offset: 2px; }

/* ---------- Carrousel ---------- */
.aa-carousel { position: relative; }
.aa-viewport { overflow: hidden; margin: 0 35px; padding: 1px; transition: height .3s ease; }
.aa-track {
	list-style: none !important; margin: 0 !important; padding: 0 !important;
	display: flex; align-items: flex-start; gap: var(--aa-gap);
	transition: transform .5s ease;
	will-change: transform;
}

/* ---------- Carte (identique aux cartes actuelles) ---------- */
.aa-card {
	flex: 0 0 calc((100% - (var(--aa-per-view) - 1) * var(--aa-gap)) / var(--aa-per-view));
	list-style: none !important;
	margin: 0 !important;
	background: var(--aa-card-bg);
	border: 1px solid var(--aa-card-border);
	border-radius: 16px;
	padding: 30px 20px;
	display: flex; flex-direction: column;
}
.aa-card[hidden] { display: none; }
.aa-card { min-width: 0; overflow-wrap: break-word; }

/* Photo à gauche ; à droite : nom, fonction, société, puis les étoiles.
   Tout le contenu de la carte est aligné à gauche. */
.aa-head {
	display: flex; align-items: center; justify-content: flex-start;
	gap: 18px; margin-bottom: 16px;
}
.aa-photo {
	width: 120px !important; height: 120px !important;
	max-width: none !important;
	border-radius: 50% !important; object-fit: cover; flex: none;
	border: 2px solid var(--aa-blue) !important;
	background: #ecebe6;
}
.aa-photo--initiales {
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 20px; color: var(--aa-muted);
}
.aa-who { font-size: 13.5px; line-height: 1.45; color: var(--aa-muted); text-align: left; min-width: 0; }
.aa-name {
	display: inline-block;
	font-size: 13.5px; font-weight: 700; color: var(--aa-ink) !important;
	text-decoration: none !important;
	border-bottom: 1px solid #c9c9c9;
	padding-bottom: 1px; margin-bottom: 3px;
}
.aa-fonction { display: block; font-size: 13.5px; font-weight: 400; color: var(--aa-ink); margin-bottom: 2px; }
.aa-societe { display: block; color: var(--aa-accent) !important; text-decoration: none !important; font-weight: 600; font-size: 13.5px; }

.aa-stars {
	text-align: left; font-size: 23px; line-height: 1.2; letter-spacing: 3px;
	color: #dcdcdc; margin: 8px 0 0 !important; white-space: nowrap;
}
.aa-star.is-on { color: var(--aa-star); }
/* Besoins de l'apprenant (page « Nos apprenants ») : alignés à gauche, comme la citation */
.aa-module .aa-besoins { text-align: left; margin: 0 0 14px !important; color: var(--aa-ink); font-size: 14px; line-height: 1.55; }
.aa-module .aa-besoins-titre { font-weight: 700 !important; margin: 0 !important; padding: 0 !important; }
.aa-module .aa-besoins-liste { list-style: disc outside !important; margin: 4px 0 0 !important; padding: 0 0 0 20px !important; }
.aa-module .aa-besoins-liste li { font-weight: 400; margin: 0 !important; padding: 0 !important; list-style: inherit !important; line-height: 1.55; }

.aa-quote {
	text-align: left; font-weight: 700 !important; font-size: 14px; line-height: 1.55;
	color: var(--aa-ink); margin: 0 !important;
}
.aa-date { text-align: left; font-weight: 400; font-size: 14px; color: var(--aa-ink); margin: 10px 0 0 !important; }
.aa-module .aa-tags {
	display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 6px;
	margin: 16px 0 0 !important;
}
.aa-module .aa-tag {
	padding: 4px 12px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid #dedede;
	font-size: 12px; font-weight: 600; color: var(--aa-ink);
	text-align: center;
}

/* ---------- Flèches et points (comme Divi) ---------- */
.aa-arrow {
	appearance: none;
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 48px; height: 48px; padding: 0;
	border: 0; background: transparent; color: var(--aa-arrow);
	display: inline-flex; align-items: center; justify-content: center;
	cursor: pointer;
	opacity: .85; transition: opacity .2s;
}
.aa-arrow:hover { opacity: 1; }
.aa-prev { left: 0; }
.aa-next { right: 0; }
.aa-group.is-single-page .aa-arrow { display: none; }
.aa-group.is-single-page .aa-viewport { margin: 0; }

.aa-dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 24px; }
.aa-dot {
	width: 10px; height: 10px; border-radius: 50%;
	background: var(--aa-arrow); border: 0; padding: 0; cursor: pointer;
	opacity: .3; transition: opacity .2s;
}
.aa-dot.is-active { opacity: 1; }
.aa-count { text-align: center; font-size: 13px; color: var(--aa-muted); margin: 12px 0 0 !important; }

/* ---------- Page « Nos apprenants » : carrousels empilés + « Afficher plus » ---------- */
.aa-groups .aa-group + .aa-group { margin-top: 48px; }
/* Carrousels sans flèches (2 avis ou moins) : même largeur que les autres pour rester alignés */
.aa-groups .aa-group.is-single-page .aa-viewport { margin: 0 35px; }
.aa-group[hidden] { display: none !important; }
/* Filtre « Tous » (1.5.2) : tous les avis en grille, même largeur que les carrousels */
.aa-all[hidden] { display: none !important; }
.aa-module .aa-grid {
	list-style: none !important; margin: 0 35px !important; padding: 0 !important;
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--aa-gap);
}
.aa-grid .aa-card { flex: none; width: auto; }
.aa-more-wrap { display: flex; justify-content: center; margin-top: 40px; }
.aa-more-wrap[hidden] { display: none !important; }
.aa-more {
	appearance: none;
	font: inherit; font-size: 14px; font-weight: 700; line-height: 1.2;
	min-height: 44px; padding: 10px 22px;
	border: 1.5px solid var(--aa-accent); border-radius: 999px;
	background: var(--aa-accent); color: #ffffff;
	cursor: pointer;
	transition: filter .2s;
}
.aa-more:hover { filter: brightness(.95); }
.aa-more:focus-visible { outline: 3px solid var(--aa-blue); outline-offset: 2px; }

/* ---------- Tablette (768 à 1024 px) : 2 cartes, photo et étoiles un peu réduites ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
	.aa-head { gap: 14px; }
	.aa-photo { width: 96px !important; height: 96px !important; }
	.aa-stars { font-size: 20px; letter-spacing: 2px; }
	.aa-card { padding: 26px 18px; }
}

/* ---------- Mobile (moins de 768 px) : une carte à la fois, sur toute la largeur ;
   les flèches passent SOUS la carte, de part et d'autre des points ---------- */
@media (max-width: 767px) {
	.aa-module { --aa-per-view: 1 !important; --aa-gap: 16px; }
	.aa-filters { padding: 18px; margin-bottom: 28px; }
	.aa-chip { padding: 10px 16px; }
	.aa-card { padding: 24px 18px; }
	.aa-groups .aa-group + .aa-group { margin-top: 36px; }
	.aa-more-wrap { margin-top: 28px; }
	.aa-module .aa-grid { grid-template-columns: minmax(0, 1fr); margin: 0 !important; }

	.aa-group {
		display: grid;
		grid-template-columns: 44px minmax(0, 1fr) 44px;
		grid-template-areas: "vp vp vp" "prev dots next" "count count count";
		align-items: center;
		column-gap: 8px;
	}
	.aa-carousel { display: contents; }
	.aa-viewport,
	.aa-groups .aa-group.is-single-page .aa-viewport { grid-area: vp; margin: 0 !important; }
	.aa-arrow { position: static; transform: none; width: 44px; height: 44px; margin-top: 16px; }
	.aa-arrow svg { width: 30px; height: 30px; }
	.aa-prev { grid-area: prev; }
	.aa-next { grid-area: next; }
	.aa-dots { grid-area: dots; margin-top: 16px; gap: 8px; }
	.aa-count { grid-area: count; }

	.aa-head { gap: 14px; }
	.aa-photo { width: 88px !important; height: 88px !important; }
	.aa-stars { font-size: 20px; letter-spacing: 2px; }
}
/* Petits téléphones (moins de 380 px) */
@media (max-width: 379px) {
	.aa-card { padding: 20px 14px; }
	.aa-head { gap: 10px; }
	.aa-photo { width: 72px !important; height: 72px !important; }
	.aa-stars { font-size: 17px; letter-spacing: 1px; }
}

@media (prefers-reduced-motion: reduce) {
	.aa-track { transition: none; }
}
