/* Avis Google — Mission Internet.
   Personnalisation par site : redéfinir les variables --mag-… dans le thème, sur :root ou sur un conteneur.
   Les valeurs par défaut (après la virgule de chaque var()) reprennent la charte de Google. */

.mag-badge, .mag-avis, .mag-badge *, .mag-avis * { box-sizing: border-box; }
.mag-visuellement-cache {
	position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
.mag-g { display: block; flex: none; }

/* Étoiles : une rangée grise, et par-dessus une rangée jaune coupée à la note (au dixième près). */
.mag-etoiles { position: relative; display: inline-flex; flex: none; line-height: 0; vertical-align: middle; }
.mag-etoiles__vide, .mag-etoiles__pleine { display: inline-flex; gap: 1px; }
.mag-etoiles__pleine { position: absolute; top: 0; left: 0; bottom: 0; width: var(--mag-remplissage, 100%); overflow: hidden; }
.mag-etoiles svg { flex: none; width: var(--mag-etoile-taille, 16px); height: var(--mag-etoile-taille, 16px); }
.mag-etoiles__vide path { fill: var(--mag-etoile-vide, #dadce0); }
.mag-etoiles__pleine path { fill: var(--mag-etoile, #fbbc04); }
.mag-etoiles--grandes { --mag-etoile-taille: 22px; }

/* ——— Badge ——— */
.mag-badge {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px 8px 10px;
	border-radius: 999px;
	background: var(--mag-fond, #fff);
	color: var(--mag-texte, #202124) !important;
	font: 500 15px/1 var(--mag-police, inherit);
	text-decoration: none !important;
	box-shadow: 0 1px 2px rgb(60 64 67 / .15), 0 2px 8px rgb(60 64 67 / .12);
	transition: box-shadow .2s ease, transform .2s ease;
}
a.mag-badge:hover { transform: translateY(-1px); box-shadow: 0 2px 4px rgb(60 64 67 / .18), 0 6px 16px rgb(60 64 67 / .16); }
.mag-badge__note { font-weight: 700; font-size: 16px; }
.mag-badge__nombre {
	padding-left: 9px;
	border-left: 1px solid var(--mag-bord, #e3e3e3);
	color: var(--mag-texte-doux, #5f6368);
	font-size: 14px;
	white-space: nowrap;
}
.mag-badge--transparent { padding-inline: 0; background: transparent; box-shadow: none; color: inherit !important; }
a.mag-badge--transparent:hover { transform: none; box-shadow: none; }
.mag-badge--transparent .mag-badge__nombre { color: inherit; opacity: .85; border-left-color: currentColor; }
.mag-badge__logo { display: inline-flex; flex: none; }

/* Compact : bandeau ou en-tête. Hérite de la couleur et de la taille du texte autour ; le « G » est posé sur une
   pastille blanche (lisible sur n'importe quel fond, y compris jaune). Étoiles : --mag-etoile / --mag-etoile-vide. */
.mag-badge--compact {
	gap: 6px;
	padding: 0;
	background: transparent;
	box-shadow: none;
	color: inherit !important;
	font: inherit;
	line-height: inherit;
	--mag-etoile-taille: 13px;
}
a.mag-badge--compact:hover { transform: none; box-shadow: none; text-decoration: underline !important; }
.mag-badge--compact .mag-badge__logo { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #fff; }
.mag-badge--compact .mag-badge__note { font-size: inherit; }
/* Couleur des liens à l'abri des constructeurs de pages : Divi force celle des liens de ses modules avec
   `.et_pb_text_2.et_pb_text a { color: … !important }` (deux classes et un élément). Les liens de l'extension
   passent donc par trois classes (d'où les classes répétées ici et les sélecteurs à trois niveaux plus bas) :
   sans cela, bouton « Laisser un avis » rose sur rose, noms en couleur de lien (vu sur fairyline.fr, Divi 4). */
.mag-badge.mag-badge.mag-badge { color: var(--mag-texte, #202124) !important; }
.mag-badge.mag-badge--transparent.mag-badge--transparent,
.mag-badge.mag-badge--compact.mag-badge--compact { color: inherit !important; }
.mag-badge--compact .mag-badge__nombre { padding-left: 0; border: 0; color: inherit; font-size: inherit; }

/* ——— Bloc d'avis ——— */
.mag-avis { color: var(--mag-texte, #202124); font-family: var(--mag-police, inherit); }

.mag-avis__entete {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	margin-bottom: 24px;
}
.mag-avis__synthese { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.mag-avis__qualificatif, .mag-avis__note { font: 700 21px/1.2 var(--mag-police-titre, inherit); }
.mag-avis .mag-avis__entete .mag-avis__tous, .mag-avis .mag-avis__entete .mag-avis__base { color: var(--mag-texte-doux, #5f6368) !important; font-size: 15px; }
a.mag-avis__tous { text-decoration: underline; text-underline-offset: 3px; }
.mag-avis__source {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding-left: 12px;
	border-left: 1px solid var(--mag-bord, #e3e3e3);
	color: var(--mag-texte-doux, #5f6368);
	font-size: 14px;
}
.mag-avis .mag-avis__entete .mag-avis__bouton {
	display: inline-flex;
	align-items: center;
	padding: 12px 22px;
	border-radius: var(--mag-bouton-rayon, 999px);
	background: var(--mag-bouton-fond, #1a73e8);
	color: var(--mag-bouton-texte, #fff) !important;
	font-weight: 700;
	text-decoration: none !important;
	transition: filter .2s ease, transform .2s ease;
}
.mag-avis__bouton:hover { filter: brightness(1.06); transform: translateY(-1px); }

.mag-avis__piste { display: grid; gap: var(--mag-ecart, 20px); outline-offset: 4px; }
/* Le carrousel ne doit pas imposer sa largeur (toutes les cartes bout à bout) aux colonnes du thème : sans ces
   deux lignes, une colonne flexible s'élargit à son contenu et la page déborde. */
.mag-avis { min-width: 0; max-width: 100%; }
.mag-avis--carrousel .mag-avis__piste { width: 0; min-width: 100%; contain: inline-size; }
.mag-avis--carrousel .mag-avis__piste {
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - 2 * var(--mag-ecart, 20px)) / 3);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	margin: -6px -4px 0;
	padding: 6px 4px 14px; /* l'ombre des cartes n'est pas coupée */
}
.mag-avis--carrousel .mag-avis__piste::-webkit-scrollbar { display: none; }
.mag-avis--grille .mag-avis__piste { grid-template-columns: repeat(auto-fill, minmax(min(290px, 100%), 1fr)); }

.mag-avis__carte {
	position: relative; /* contient les textes pour lecteurs d'écran (sinon, hors champ du carrousel, ils élargissent la page) */
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 22px;
	scroll-snap-align: start;
	background: var(--mag-fond, #fff);
	border: 1px solid var(--mag-bord, #ebebeb);
	border-radius: var(--mag-rayon, 14px);
	box-shadow: var(--mag-ombre, 0 1px 2px rgb(60 64 67 / .08), 0 4px 14px rgb(60 64 67 / .06));
}
.mag-avis__auteur { display: flex; align-items: center; gap: 12px; }
.mag-avis__photo { flex: none; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: #e8eaed; }
.mag-avis__photo--initiale { display: grid; place-items: center; color: #fff; font-weight: 700; background: var(--mag-initiale, #5f6368); }
.mag-avis__qui { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.mag-avis .mag-avis__qui .mag-avis__nom {
	overflow: hidden;
	color: inherit !important;
	font: 700 16px/1.3 var(--mag-police-titre, inherit);
	text-decoration: none !important;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.mag-avis .mag-avis__qui a.mag-avis__nom:hover { text-decoration: underline !important; }
.mag-avis__date { color: var(--mag-texte-doux, #5f6368); font-size: 13px; }
/* Coupure à N lignes par une hauteur exacte (N × interligne), pas par -webkit-line-clamp : celui-ci laisse
   dépasser un morceau de ligne quand l'avis contient des retours à la ligne. Fondu sur la dernière ligne quand le
   texte est coupé (classe posée par le script). */
.mag-avis .mag-avis__texte { /* double classe : l'emporte sur les marges que les thèmes posent sur les blocs de texte */
	max-height: calc(var(--mag-lignes, 5) * 1.6em);
	overflow: hidden;
	margin: 0;
	padding: 0;
	color: var(--mag-texte-avis, #3c4043);
	font-size: 15px;
	line-height: 1.6;
	white-space: pre-line; /* paragraphes de l'avis conservés */
}
.mag-avis__texte.est-coupe {
	-webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 1.6em), transparent);
	mask-image: linear-gradient(to bottom, #000 calc(100% - 1.6em), transparent);
}
.mag-avis .mag-avis__carte.est-deplie .mag-avis__texte { max-height: none; -webkit-mask-image: none; mask-image: none; }
.mag-avis__suite {
	align-self: flex-start;
	margin-top: -4px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--mag-lien, #1a73e8);
	font: 700 14px/1.4 var(--mag-police, inherit);
	cursor: pointer;
}
.mag-avis__suite:hover { text-decoration: underline; }

.mag-avis__nav { display: flex; justify-content: flex-end; gap: 10px; margin-top: 6px; }
.mag-avis__nav[hidden] { display: none; }
.mag-avis__fleche {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--mag-bord, #dadce0);
	border-radius: 50%;
	background: var(--mag-fond, #fff);
	color: var(--mag-texte, #202124);
	cursor: pointer;
	transition: background-color .2s ease, opacity .2s ease;
}
.mag-avis__fleche svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.mag-avis__fleche:hover:not(:disabled) { background: var(--mag-survol, #f1f3f4); }
.mag-avis__fleche:disabled { opacity: .35; cursor: default; }

.mag-avis__mention { margin: 18px 0 0; color: var(--mag-texte-doux, #5f6368); font-size: 13px; }
.mag-avis .mag-avis__mention .mag-avis__voir { color: inherit !important; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 900px) {
	.mag-avis--carrousel .mag-avis__piste { grid-auto-columns: calc((100% - var(--mag-ecart, 20px)) / 2); }
}
@media (max-width: 600px) {
	.mag-avis__entete { flex-direction: column; align-items: flex-start; }
	.mag-avis--carrousel .mag-avis__piste { grid-auto-columns: 86%; }
	.mag-avis__carte { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
	.mag-avis--carrousel .mag-avis__piste { scroll-behavior: auto; }
	.mag-badge, .mag-avis__bouton { transition: none; }
}
