/**
 * Avis Société des Avis Garantis dans une fenêtre (inc/woocommerce/product-reviews.php,
 * assets/js/reviews-modal.js). Ordinateur et tablette : fenêtre centrée ; mobile : volet
 * qui monte du bas. Le contenu de l'extension (main.css : largeurs en %, hauteur fixe,
 * polices Open Sans / Oswald) est remis aux couleurs du thème.
 * Fichier autonome (hors build Tailwind) : jetons de la charte recopiés ci-dessous.
 */
:root {
	--ks-r-orange: #ff8000;
	--ks-r-orange-dark: #e56f00;
	--ks-r-purple: #a2257c;
	--ks-r-ink: #2a2230;
	--ks-r-ink-soft: #5d5463;
	--ks-r-muted: #8c8391;
	--ks-r-line: #eee4d8;
	--ks-r-cream: #fff8f0;
	--ks-r-peach: #fff0e0;
	--ks-r-sans: "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--ks-r-display: "Fraunces", Georgia, "Times New Roman", serif;
}

/* Liste complète : plus dans la page (elle n'est visible que dans la fenêtre). */
#ag-s {
	display: none !important;
}

.ks-reviews #ag-s {
	display: block !important;
	margin: 0;
	padding: 0;
}

/* Page bloquée tant que la fenêtre est ouverte (aucun état à remettre à zéro à la fermeture). */
html:has(dialog.ks-reviews[open]) {
	overflow: hidden;
}

/* Logo du résumé : pour les visiteurs, WP Rocket (« dimensions d'image manquantes ») ajoute
   width="175" height="158" ; avec le max-height de l'extension, le logo était écrasé en largeur.
   Les administrateurs ne voyaient pas le défaut (pages non optimisées). */
#agWidgetH .logoAg {
	width: auto;
	height: auto;
	max-height: 77px;
}

/* Résumé de la colonne d'achat : déclencheur */
#agWidgetH.ks-reviews-trigger {
	cursor: pointer;
	transition:
		box-shadow 0.15s ease,
		transform 0.15s ease;
}

@media (hover: hover) {
	#agWidgetH.ks-reviews-trigger:hover {
		box-shadow: 0 10px 24px -14px rgba(42, 34, 48, 0.45);
		transform: translateY(-1px);
	}
}

#agWidgetH.ks-reviews-trigger:focus-visible {
	outline: 2px solid var(--ks-r-orange);
	outline-offset: 3px;
}

/* Fenêtre */
.ks-reviews {
	width: min(760px, calc(100vw - 48px));
	max-width: none;
	max-height: min(86vh, 900px);
	margin: auto;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 24px;
	background: #fff;
	color: var(--ks-r-ink);
	font-family: var(--ks-r-sans);
	box-shadow: 0 30px 80px -20px rgba(42, 34, 48, 0.45);
}

.ks-reviews[open] {
	display: flex;
	flex-direction: column;
	animation: ks-reviews-in 0.22s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.ks-reviews::backdrop {
	background: rgba(42, 34, 48, 0.55);
	backdrop-filter: blur(3px);
}

@keyframes ks-reviews-in {
	from {
		opacity: 0;
		transform: translateY(16px) scale(0.98);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.ks-reviews__head {
	display: flex;
	flex-shrink: 0;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 22px 24px 18px;
	border-bottom: 1px solid var(--ks-r-line);
}

.ks-reviews__eyebrow {
	margin: 0 0 4px;
	font-size: 12px;
	font-weight: 600;
	color: var(--ks-r-purple);
}

.ks-reviews__title {
	margin: 0;
	font-family: var(--ks-r-display);
	font-size: 26px;
	font-weight: 600;
	line-height: 1.15;
	color: var(--ks-r-ink);
}

.ks-reviews__meta {
	margin: 6px 0 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--ks-r-ink-soft);
}

.ks-reviews__meta:empty {
	display: none;
}

.ks-reviews__close {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: var(--ks-r-cream);
	color: var(--ks-r-ink-soft);
	cursor: pointer;
	transition:
		background-color 0.15s ease,
		color 0.15s ease;
}

.ks-reviews__close:hover {
	background: var(--ks-r-peach);
	color: var(--ks-r-orange-dark);
}

.ks-reviews__close:focus-visible {
	outline: 2px solid var(--ks-r-orange);
	outline-offset: 2px;
}

.ks-reviews__body {
	flex: 1;
	min-height: 0;
	padding: 20px 24px 28px;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

/* Contenu de l'extension */
.ks-reviews #agWidgetMain,
.ks-reviews #agWidgetMain .reviewList,
.ks-reviews #agWidgetMain .author,
.ks-reviews #agWidgetMain .reviewTxt p {
	font-family: var(--ks-r-sans);
}

.ks-reviews #agWidgetMain {
	padding: 0;
	overflow: visible;
	border: 0;
	background: none;
	/* Contour intérieur gris (#dfdfdf) et dégradé imposés par main.css de l'extension. */
	box-shadow: none;
	filter: none;
	line-height: 1.4;
	text-align: left;
}

.ks-reviews #agWidgetMain .topBar {
	display: none;
}

/* Synthèse : attestation, répartition des notes, note globale */
.ks-reviews #agWidgetMain .inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 16px 28px;
	height: auto;
	padding: 18px 20px;
	overflow: visible;
	border-radius: 18px;
	background: var(--ks-r-cream);
}

.ks-reviews #agWidgetMain .logoCont,
.ks-reviews #agWidgetMain .statCont,
.ks-reviews #agWidgetMain .reviewCont {
	display: block !important;
	width: auto;
	min-width: 0;
	height: auto;
	margin: 0;
	text-align: left;
}

/* Répartition des notes : barres moins hautes (l'extension fixe 116 px par colonne). */
.ks-reviews #agWidgetMain .steavisgarantisStats .item {
	height: auto;
}

.ks-reviews #agWidgetMain .steavisgarantisStats .item .stat {
	height: 64px;
}

.ks-reviews #agWidgetMain .logoAg {
	max-width: 140px;
	height: auto;
	margin: 0 0 10px;
}

.ks-reviews #agWidgetMain .logoCont .agBt {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 7px 14px;
	border-radius: 999px;
	font-family: var(--ks-r-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-decoration: none;
}

.ks-reviews #agWidgetMain .reviewCont .reviewGlobal {
	padding: 0;
	text-align: center;
}

.ks-reviews #agWidgetMain .largeNote {
	width: auto;
	font-family: var(--ks-r-display);
	font-size: 22px;
	line-height: 1;
	letter-spacing: 0;
	color: var(--ks-r-ink);
}

.ks-reviews #agWidgetMain .largeNote big {
	font-size: 48px;
	letter-spacing: -1px;
	color: var(--ks-r-purple);
}

.ks-reviews #agWidgetMain .largeNote p {
	margin: 6px 0 0;
	font-family: var(--ks-r-sans);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--ks-r-ink-soft);
}

/* Liste des avis en cartes */
.ks-reviews #agWidgetMain .reviewList {
	display: grid;
	gap: 12px;
	margin: 16px 0 0;
	padding: 0;
	line-height: 1.45;
}

.ks-reviews #agWidgetMain .reviewList li {
	position: relative;
	margin: 0;
	padding: 16px 18px;
	border: 1.5px solid var(--ks-r-line);
	border-radius: 16px;
	background: #fff;
}

.ks-reviews #agWidgetMain .author {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 8px;
	padding-right: 112px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ks-r-ink);
}

.ks-reviews #agWidgetMain .author .authorAvatar {
	float: none;
	width: 28px;
	margin: 0;
}

/* Drapeau de l'extension : image souvent introuvable (icône d'image cassée). */
.ks-reviews #agWidgetMain .author .agFlag {
	display: none !important;
}

.ks-reviews #agWidgetMain .author .time {
	display: block;
	flex-basis: 100%;
	font-size: 12px;
	font-weight: 400;
	color: var(--ks-r-muted);
}

.ks-reviews #agWidgetMain .author .time .published {
	font-weight: 600;
	color: var(--ks-r-ink-soft);
}

.ks-reviews #agWidgetMain .steavisgarantisStar {
	top: 14px;
	right: 14px;
	transform: scale(0.85);
	transform-origin: top right;
}

.ks-reviews #agWidgetMain .reviewTxt p {
	margin: 10px 0 0;
	font-size: 15px;
	color: var(--ks-r-ink);
}

/* « Voir plus d'avis » de l'extension */
.ks-reviews #agWidgetMain #more-reviews {
	display: flex;
	justify-content: center;
	margin: 16px auto 0;
}

.ks-reviews #agWidgetMain #more-reviews a,
.ks-reviews #agWidgetMain #more-reviews button,
.ks-reviews #agWidgetMain a#more-reviews {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 22px;
	border: 1.5px solid var(--ks-r-orange);
	border-radius: 999px;
	background: #fff;
	color: var(--ks-r-orange-dark);
	font-family: var(--ks-r-sans);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

/* Tablette : synthèse sur deux lignes (attestation + note, puis répartition) */
@media (max-width: 900px) {
	.ks-reviews #agWidgetMain .inner {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	.ks-reviews #agWidgetMain .statCont {
		grid-column: 1 / -1;
		grid-row: 2;
		text-align: center;
	}
}

/* Mobile : volet qui monte du bas */
@media (max-width: 639px) {
	.ks-reviews {
		width: 100%;
		max-height: 90vh;
		max-height: 90dvh;
		margin: auto 0 0;
		border-radius: 24px 24px 0 0;
	}

	.ks-reviews[open] {
		animation-name: ks-reviews-sheet;
	}

	.ks-reviews__head {
		padding: 18px 16px 14px;
	}

	.ks-reviews__title {
		font-size: 22px;
	}

	.ks-reviews__body {
		padding: 16px 16px calc(24px + env(safe-area-inset-bottom));
	}

	.ks-reviews #agWidgetMain .inner {
		gap: 14px 16px;
		padding: 16px;
	}

	.ks-reviews #agWidgetMain .largeNote big {
		font-size: 40px;
	}

	.ks-reviews #agWidgetMain .reviewList li {
		padding: 14px;
	}

	/* Étoiles sous le nom plutôt qu'à droite. */
	.ks-reviews #agWidgetMain .author {
		padding-right: 0;
	}

	.ks-reviews #agWidgetMain .steavisgarantisStar {
		position: relative;
		top: auto;
		right: auto;
		margin: 8px 0 0 -4px;
		transform: scale(0.85);
		transform-origin: top left;
	}
}

@keyframes ks-reviews-sheet {
	from {
		transform: translateY(100%);
	}
	to {
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ks-reviews[open] {
		animation: none;
	}
}