/* ==========================================================================
   SCOPE - témoignages : habillage du shortcode [scope_testimonials] (scope-testimonials.css)
   --------------------------------------------------------------------------
   Chargé par scope-review-contest.php, une seule fois par page, même avec plusieurs shortcodes (accueil, concours, « Ils parlent de nous »).
   Couleurs, angles : les variables --scope-* du site (scope-themes.css, mu-plugin) quand elles existent, donc le thème actif et les futurs thèmes sont suivis
   sans rien ajouter ici. La valeur après la virgule est l'aspect d'origine du plugin : le shortcode reste correct sur une page qui n'a pas ces variables.
   Les pastilles colorées (produit, Avis Google, gagnant du tirage au sort) et les étoiles gardent leurs propres couleurs, lisibles sur fond clair comme sombre.
   Sans JavaScript : tous les avis sont affichés en entier. Le script (scope-testimonials.js) ajoute la classe .sa-js, puis « Lire la suite », la pagination
   et « Afficher plus d'avis ».
   ========================================================================== */

.sa-testimonials-slider, .sa-testimonials-list { margin: 0; text-align: left; }
.sa-testimonials-slider *, .sa-testimonials-list * { box-sizing: border-box; }

/* Liste des avis */
.sa-testimonials { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; margin: 1.5rem 0; }
.sa-testimonial-card { display: flex; flex-direction: column; min-width: 0; padding: 1.25rem 1.4rem; border: 1px solid var(--scope-soft, rgba(0, 0, 0, .08)); border-radius: var(--scope-radius, 12px);
	background: var(--scope-card, #ffffff); box-shadow: none; color: var(--scope-text, #1f2933); }
.sa-testimonial-card:focus-visible { outline: 3px solid var(--scope-focus, #111827); outline-offset: 3px; }
.sa-testimonial-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .4rem .6rem; margin: 0 0 .75rem; font-size: .9rem; }
.sa-testimonial-author { color: var(--scope-head, #111827); font-weight: 700; }
.sa-testimonial-product-pill { padding: .1rem .65rem; border-radius: 999px; background: #ecfdf3; color: #166534; font-size: .8rem; font-weight: 600; line-height: 1.5; }
.sa-pill-google { background: #eff6ff; color: #1e40af; }

/* Note : étoiles + valeur */
.sa-testimonial-rating { display: flex; align-items: center; gap: .4rem; margin: 0 0 .5rem; font-size: .9rem; }
.sa-stars { display: inline-flex; line-height: 1; }
.sa-star { margin-right: 1px; font-size: 1rem; }
.sa-star-full { color: #fbbf24; }
.sa-star-half { background: linear-gradient(90deg, #fbbf24 50%, var(--scope-soft, #e5e7eb) 50%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sa-star-empty { color: var(--scope-soft, #e5e7eb); }
.sa-rating-value { color: var(--scope-dim, #4b5563); font-size: .85rem; }

/* Texte de l'avis : en entier par défaut ; avec le script, début + « Lire la suite » */
.sa-testimonial-content { flex-grow: 1; margin-top: .25rem; color: var(--scope-text, #1f2933); font-size: .95rem; line-height: 1.6; overflow-wrap: anywhere; }
.sa-testimonial-content a { color: var(--scope-link, #1e40af); }
.sa-review-excerpt { display: none; }
.sa-review-full { display: inline; }
.sa-js .sa-review-excerpt { display: inline; }
.sa-js .sa-review-full { display: none; }
.sa-js .sa-testimonial-content.sa-open .sa-review-excerpt { display: none; }
.sa-js .sa-testimonial-content.sa-open .sa-review-full { display: inline; }
.sa-read-more-btn { display: inline-block; min-height: 32px; margin: .35rem 0 0; padding: .25rem 0; border: 0; background: none; color: var(--scope-link, #4b5563); font: inherit; font-size: .9rem;
	text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }
/* sans JavaScript : pas de bouton (le texte est déjà en entier) ; sélecteur plus précis que la règle « html body .sa-read-more-btn » du confort tactile des thèmes */
.sa-testimonials-slider:not(.sa-js) .sa-read-more-btn, .sa-testimonials-list:not(.sa-js) .sa-read-more-btn { display: none; }
.sa-read-more-btn:focus-visible { outline: 3px solid var(--scope-focus, #111827); outline-offset: 2px; }
.sa-testimonial-footer { margin-top: .75rem; }
.sa-testimonial-winner { display: inline-block; padding: .15rem .65rem; border-radius: 999px; background: #fef3c7; color: #92400e; font-size: .8rem; font-weight: 600; }
.sa-testimonials-empty { margin: 1.5rem 0; padding: 1rem 1.25rem; border-radius: var(--scope-radius, 12px); background: var(--scope-bg-alt, #f9fafb); color: var(--scope-dim, #4b5563); font-size: .95rem; }

/* Résumé en tête (attribut summary="1") : note moyenne et nombre d'avis */
.sa-summary { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.1rem; margin: 0 0 1.25rem; padding: 1rem 1.25rem; border: 1px solid var(--scope-soft, rgba(0, 0, 0, .08));
	border-radius: var(--scope-radius, 12px); background: var(--scope-bg-alt, #f9fafb); }
.sa-summary-score { color: var(--scope-head, #111827); font-family: var(--scope-font-head, inherit); font-size: 2rem; font-weight: 700; line-height: 1; }
.sa-summary-score small { font-size: 1rem; font-weight: 400; }
.sa-summary .sa-star { font-size: 1.35rem; }
.sa-summary-count { color: var(--scope-text, #1f2933); font-size: .95rem; }

/* Pagination (mode slider) : cachée sans JavaScript */
.sa-testimonials-pagination { display: none; justify-content: center; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.sa-js .sa-testimonials-pagination { display: flex; }
.sa-page-arrow { display: flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; margin: 0; padding: 0; border: 0; border-radius: 50%; background: var(--scope-bg-alt, #f3f4f6);
	color: var(--scope-text, #4b5563); font-size: 1.3rem; line-height: 1; cursor: pointer; }
.sa-page-arrow:hover { background: var(--scope-soft, #e5e7eb); }
.sa-page-dots { display: flex; align-items: center; }
.sa-page-dot { position: relative; width: 1.5rem; height: 1.5rem; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer; }
.sa-page-dot::before { content: ""; position: absolute; top: 50%; left: 50%; width: .65rem; height: .65rem; margin: -.325rem 0 0 -.325rem; border: 1px solid var(--scope-line, #d1d5db); border-radius: 50%; background: var(--scope-card, #f9fafb); }
.sa-page-dot-active::before { border-color: var(--scope-accent, #111827); background: var(--scope-accent, #111827); }
.sa-page-arrow:focus-visible, .sa-page-dot:focus-visible { outline: 3px solid var(--scope-focus, #111827); outline-offset: 2px; }

/* « Afficher plus d'avis » (mode liste, attribut initial) : visible avec JavaScript seulement */
.sa-more { display: none; margin: 0 0 1rem; text-align: center; }
.sa-js .sa-more { display: block; }
.sa-more-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; margin: 0; padding: .7em 1.4em; border: 2px solid var(--scope-link, #111827); border-radius: var(--scope-radius, 12px);
	background: transparent; color: var(--scope-link, #111827); font: inherit; font-size: 1rem; font-weight: 700; line-height: 1.2; cursor: pointer; }
.sa-more-btn:hover, .sa-more-btn:focus-visible { background: var(--scope-accent, #111827); color: var(--scope-on-accent, #ffffff); }
.sa-more-btn:focus-visible { outline: 3px solid var(--scope-focus, #111827); outline-offset: 3px; }

.sa-is-hidden { display: none !important; }
.sa-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
