/* Wellness Affiliate Core — composants isolés (préfixe .wac-) */
.wac-card,
.wac-vs {
	--wac-accent: #b0306a;
	--wac-accent-ink: #fff;
	--wac-border: #e6e1e4;
	--wac-bg: #fff;
	--wac-muted: #6b6168;
	--wac-pro: #1f7a4d;
	--wac-con: #b3261e;
	--wac-star: #e8a317;
	--wac-radius: 10px;
	box-sizing: border-box;
	font-size: 1rem;
	line-height: 1.5;
	margin: 1.5em 0;
}
.wac-card *,
.wac-vs * { box-sizing: inherit; }

/* Carte résumé */
.wac-card {
	background: var(--wac-bg);
	border: 1px solid var(--wac-border);
	border-radius: var(--wac-radius);
	padding: 1.25rem;
}
.wac-card__head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: .5rem 1rem;
	margin-bottom: 1rem;
}
.wac-card__title { font-size: 1.15rem; font-weight: 700; margin: 0; }
.wac-card__rating { display: flex; align-items: center; gap: .5rem; }

.wac-specs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: .5rem;
	margin: 0 0 1rem;
}
.wac-specs div { background: #faf7f9; border-radius: 6px; padding: .5rem .75rem; }
.wac-specs dt { color: var(--wac-muted); font-size: .8rem; margin: 0; }
.wac-specs dd { font-weight: 600; margin: 0; }

.wac-proscons {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem;
	margin-bottom: 1rem;
}
.wac-label { font-weight: 700; margin: 0 0 .25rem; }
.wac-label--pro { color: var(--wac-pro); }
.wac-label--con { color: var(--wac-con); }

.wac-list { list-style: none; margin: 0; padding: 0; }
.wac-list li { padding-left: 1.4em; position: relative; margin: .2em 0; }
.wac-list li::before { position: absolute; left: 0; font-weight: 700; }
.wac-list--pro li::before { content: "+"; color: var(--wac-pro); }
.wac-list--con li::before { content: "−"; color: var(--wac-con); }

/* Étoiles (CSS pur, aucune image) */
.wac-stars {
	position: relative;
	display: inline-block;
	font-size: 1.1em;
	line-height: 1;
	color: var(--wac-border);
	letter-spacing: 2px;
}
.wac-stars::before { content: "★★★★★"; }
.wac-stars__fill {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	white-space: nowrap;
	color: var(--wac-star);
}
.wac-stars__fill::before { content: "★★★★★"; }
.wac-score { font-weight: 700; margin-left: .35em; }

/* Bouton CTA */
.wac-btn {
	display: inline-block;
	background: var(--wac-accent);
	color: var(--wac-accent-ink) !important;
	border-radius: 999px;
	font-weight: 700;
	padding: .7em 1.6em;
	text-align: center;
	text-decoration: none !important;
	transition: filter .15s ease;
}
.wac-btn:hover,
.wac-btn:focus-visible { filter: brightness(1.1); }
.wac-btn:focus-visible { outline: 2px solid var(--wac-accent); outline-offset: 2px; }

/* Tableau VS */
.wac-vs { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.wac-vs__table {
	width: 100%;
	min-width: 480px;
	border-collapse: collapse;
	border: 1px solid var(--wac-border);
	background: var(--wac-bg);
}
.wac-vs__table th,
.wac-vs__table td {
	border-bottom: 1px solid var(--wac-border);
	padding: .65rem .75rem;
	text-align: left;
	vertical-align: top;
}
.wac-vs__table thead th { background: #faf7f9; font-size: 1.05rem; }
.wac-vs__table tbody th[scope="row"] { color: var(--wac-muted); font-weight: 600; width: 28%; }
.wac-vs__cta td { text-align: center; }

.wac-error { color: var(--wac-con); font-weight: 600; }

@media (max-width: 600px) {
	.wac-card { padding: 1rem; }
	.wac-btn { display: block; }
}

/* Pages hub */
.wac-hub {
	--wac-accent: #b0306a;
	--wac-accent-ink: #fff;
	--wac-border: #e6e1e4;
	--wac-muted: #6b6168;
	--wac-star: #e8a317;
	margin: 1.5em 0;
}
.wac-hub__note { color: var(--wac-muted); font-style: italic; }
.wac-hub__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: .75rem;
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
}
.wac-hub__item {
	display: block;
	height: 100%;
	background: #fff;
	border: 1px solid var(--wac-border);
	border-radius: 10px;
	padding: 1rem;
	color: inherit;
	text-decoration: none;
	transition: border-color .15s ease;
}
.wac-hub__item:hover,
.wac-hub__item:focus-visible { border-color: var(--wac-accent); }
.wac-hub__title { display: block; font-weight: 700; color: var(--wac-accent); }
.wac-hub__excerpt { display: block; color: var(--wac-muted); font-size: .9rem; margin-top: .25rem; }

.wac-rank { margin: 2rem 0; }
.wac-rank__heading { margin-bottom: .75rem; }
.wac-rank__list {
	list-style: none;
	counter-reset: wac-rank;
	margin: 0;
	padding: 0;
	border: 1px solid var(--wac-border);
	border-radius: 10px;
	background: #fff;
}
.wac-rank__item {
	counter-increment: wac-rank;
	display: grid;
	grid-template-columns: 2rem 1fr auto;
	grid-template-areas: "num main rating" "num actions actions";
	align-items: center;
	gap: .35rem .75rem;
	padding: .85rem 1rem;
	margin: 0;
	border-top: 1px solid var(--wac-border);
}
.wac-rank__item:first-child { border-top: 0; }
.wac-rank__item::before {
	content: counter(wac-rank);
	grid-area: num;
	align-self: start;
	font-weight: 700;
	color: var(--wac-muted);
}
.wac-rank__main { grid-area: main; min-width: 0; }
.wac-rank__name { font-weight: 700; color: inherit; text-decoration: none; }
.wac-rank__name:hover { color: var(--wac-accent); }
.wac-rank__brand { display: block; color: var(--wac-muted); font-size: .85rem; }
.wac-rank__rating { grid-area: rating; white-space: nowrap; }
.wac-rank__actions { grid-area: actions; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.wac-rank__review { font-size: .9rem; }
.wac-rank__actions .wac-btn { padding: .4em 1.1em; font-size: .9rem; }
.wac-rank__more { margin-top: .5rem; font-weight: 600; }

@media (max-width: 600px) {
	.wac-rank__item { grid-template-areas: "num main" "num rating" "num actions"; grid-template-columns: 2rem 1fr; }
	.wac-rank__actions .wac-btn { display: inline-block; }
}