/*
 * Thème Solanum – surcharges hors build Webpack (www.biofib.com)
 * Chargée après app.css. Voir MODIFICATIONS.md.
 */

/* ── Largeurs de lecture ─────────────────────────────── */

/* Mise en page (grilles, heros, bandeaux) : 1 280 px max au lieu de 1 920 */
:root {
	--container-w: 80rem;
}

/* Header et footer ont déjà une marge latérale (--spc-x) autour de leur .container :
   on la retranche pour que leurs bords s'alignent sur ceux du contenu */
.header .container,
.footer .container {
	--container-w: calc(80rem - 2 * var(--spc-x));
}

/* Texte courant : ~70 caractères par ligne (au lieu de 960 px) */
.container--cms {
	--container-w: 50rem;
}

/* ── État vide des listings ──────────────────────────── */

.empty-state {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	max-width: 40rem;
	margin: 3rem auto 5rem;
	padding: 3.5rem 2rem;
	text-align: center;
	color: var(--green-700);
	background-color: var(--gray-light);
	border-radius: .5rem;
}

.empty-state-icon {
	font-size: 3rem;
	color: var(--green-300);
}

.empty-state-title {
	margin: 0;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.3;
}

.empty-state-text {
	margin: 0;
	line-height: 1.6;
}

/* ── Vignettes de cartes : visuel entier, non recadré (couvertures) ── */

.base-card-image--contain {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}

.base-card-image--contain img {
	width: auto;
	max-width: 250px;
	height: 100%;
	object-fit: contain;
}

/* ── Hero des contenus (articles, ressources, communiqués, réalisations) ──
   Le fond beige (::before) s'arrête 7rem avant le bas pour laisser déborder le visuel.
   Sans visuel, il doit couvrir tout le hero ; avec une couverture, il s'arrête à son tiers. */

.post-hero-container:not(:has(.post-hero-image, .post-hero-cover)) {
	padding-bottom: 3.5rem;
}

.post-hero-container:not(:has(.post-hero-image, .post-hero-cover))::before {
	height: 100%;
}

.post-hero-container:has(.post-hero-cover)::before {
	height: calc(100% - 15rem);
}

/* Couverture de document : entière, centrée, hauteur fixe pour un débordement régulier */
.post-hero-cover {
	position: relative;	/* au-dessus du fond beige (::before positionné) */
	display: flex;
	justify-content: center;
	height: 22rem;
	margin-top: 2.5rem;
}

.post-hero-cover img {
	display: block;
	width: auto;
	max-width: 100%;
	height: 100%;
	border-radius: .25rem;
	box-shadow: 0 .75rem 2rem rgba(0, 69, 54, .18);
}

/* ── Modèle Hub (page carrefour) ──────────────────────── */

.hub-intro {
	margin-block: 3rem 1rem;
}

.hub-section {
	margin-block: 3rem;
}

.hub-section-title {
	margin-bottom: -1.5rem;	/* rapproche le titre de la grille (list-grid a 3rem de marge) */
	color: var(--green-700);
}

.hub-section + .hub-section {
	padding-top: 3rem;
	border-top: 1px solid var(--green-100);
}

/* ── Survol des cartes (base-card) et des boutons d'action ──
   La carte entière est déjà cliquable (lien étiré .base-card-link::after) */

.list-grid .base-card {
	height: 100%;	/* cartes d'une même rangée à hauteur égale */
}

.base-card {
	background-color: var(--white);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.base-card:hover {
	transform: translateY(-4px);
	border-color: var(--green-300);
	box-shadow: 0 .75rem 2rem rgba(0, 69, 54, .12);
}

.base-card:has(.base-card-link:focus-visible) {
	outline: 2px solid var(--green-300);
	outline-offset: 3px;
}

.base-card-image img {
	transition: transform .4s ease;
}

.base-card:hover .base-card-image img {
	transform: scale(1.04);
}

/* Boutons d'action (Lire, Découvrir, Télécharger…) : icône inversée et décalée */
.button-inline .button-icon {
	transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.button-inline:hover .button-icon,
.button-inline:focus-visible .button-icon,
.base-card:hover .base-card-link .button-icon {
	color: var(--white);
	background-color: var(--green-700);
	transform: translateX(4px);
}

@media (prefers-reduced-motion: reduce) {
	.base-card,
	.base-card-image img,
	.button-inline .button-icon {
		transition: none;
	}

	.base-card:hover,
	.base-card:hover .base-card-image img,
	.button-inline:hover .button-icon,
	.base-card:hover .base-card-link .button-icon {
		transform: none;
	}
}