/*
 * core/post-template — carrousel d'articles (styles gaia-slider et gaia-slider-wide).
 * Chargé par wp_enqueue_block_style() seulement si une boucle est sur la page.
 *
 * Le même carrousel que le groupe gaia-slider, appliqué aux cartes d'une
 * requête : défilement natif, accroche à gauche, la carte suivante dépasse du
 * bord pour dire qu'il y a une suite. La mise en page choisie dans l'éditeur
 * (liste ou grille) est écrasée : un carrousel est une ligne, par définition.
 *
 * gaia-slider-wide ne change que la largeur d'une carte : une par vue, la
 * suivante dépassant de quelques pour cent — l'article à la une qui défile.
 */
.wp-block-post-template.is-style-gaia-slider,
.wp-block-post-template.is-style-gaia-slider-wide {
	--gaia-slide: min(85%, 22rem);
	display: flex !important;
	flex-wrap: nowrap;
	gap: var(--wp--preset--spacing--40);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	scrollbar-color: var(--wp--preset--color--border-strong) transparent;
	padding-bottom: var(--wp--preset--spacing--30);
}

.wp-block-post-template.is-style-gaia-slider-wide {
	--gaia-slide: 92%;
}

.wp-block-post-template.is-style-gaia-slider > li,
.wp-block-post-template.is-style-gaia-slider-wide > li {

	/*
	 * position: relative tient dans le carrousel les éléments en position
	 * absolue d'une carte — le texte pour lecteur d'écran de core/read-more.
	 * Sans cela, leur bloc conteneur est la page : ils échappent au rognage du
	 * défilement et élargissent le document de toute la longueur de la rangée
	 * (5 586 px mesurés à 1440).
	 */
	position: relative;
	flex: 0 0 var(--gaia-slide);
	width: auto;
	margin: 0;
	scroll-snap-align: start;
}

.wp-block-post-template.is-style-gaia-slider:focus-visible,
.wp-block-post-template.is-style-gaia-slider-wide:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 4px;
}

@media (prefers-reduced-motion: no-preference) {

	.wp-block-post-template.is-style-gaia-slider,
	.wp-block-post-template.is-style-gaia-slider-wide {
		scroll-behavior: smooth;
	}
}

/*
 * Cartes d'articles : elles se soulèvent au survol ou au focus clavier, et le
 * titre se souligne (revue mes-jeux-videos, retour #6).
 */
@media (prefers-reduced-motion: no-preference) {

	.wp-block-post-template > li > .wp-block-cover,
	.wp-block-post-template > li > .wp-block-group {
		transition: transform var(--wp--custom--transition--base), box-shadow var(--wp--custom--transition--base);
	}

	.wp-block-post-template > li > .wp-block-cover:hover,
	.wp-block-post-template > li > .wp-block-cover:focus-within {
		transform: translateY(-0.25rem);
		box-shadow: 0 0.75rem 1.5rem color-mix(in srgb, var(--wp--preset--color--contrast) 22%, transparent);
	}
}

.wp-block-post-template > li:hover .wp-block-post-title a,
.wp-block-post-template > li:focus-within .wp-block-post-title a {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Extraits de carte : resserrés. */
.wp-block-post-template .wp-block-post-excerpt__excerpt {
	line-height: 1.45;
}

/*
 * Grilles de portail d'actualité (socle 3.34.0) — posts-bento-rows, posts-cards-dense,
 * posts-overlay-sidebar, posts-thumbs-row, posts-picks-aside. Une classe sur core/post-template
 * (layout « default ») : la grille du cœur ne sait ni fusionner des cellules ni fixer cinq
 * colonnes qui se replient à 3, 2 puis 1.
 */
.wp-block-post-template:is(.gaia-bento-rows, .gaia-grid-5, .gaia-grid-3-tall, .gaia-picks) {
	display: grid;
	gap: var(--wp--preset--spacing--30);
	margin: 0;
	padding: 0;
	list-style: none;
}

.wp-block-post-template:is(.gaia-bento-rows, .gaia-grid-3-tall, .gaia-picks) > li > .wp-block-cover {
	height: 100%;
	min-height: 0 !important;
}

/* Deux rangées : une grande carte et deux empilées, puis une large et une étroite. */
.gaia-bento-rows {
	grid-template-columns: repeat(6, minmax(0, 1fr));
	grid-template-rows: 11.75rem 11.75rem 13.5rem;
}

.gaia-bento-rows > li:nth-child(1) { grid-column: span 3; grid-row: span 2; }

.gaia-bento-rows > li:nth-child(2),
.gaia-bento-rows > li:nth-child(3) { grid-column: span 3; }

.gaia-bento-rows > li:nth-child(4) { grid-column: span 4; }

.gaia-bento-rows > li:nth-child(5) { grid-column: span 2; }

.gaia-bento-rows > li:nth-child(n+6) { display: none; }

/* Cinq colonnes de cartes ou de vignettes. */
.gaia-grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* Trois colonnes de cartes hautes, sur image. */
.gaia-grid-3-tall {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-auto-rows: 14.5rem;
}

/* Une carte haute à gauche sur deux rangées, quatre cartes deux par deux à droite. */
.gaia-picks { grid-template-columns: 2fr 1fr 1fr; }

.gaia-picks > li:first-child { grid-row: span 2; }

@media (max-width: 1023px) {

	.gaia-grid-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

	.gaia-picks { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	.gaia-picks > li:first-child { grid-column: span 2; grid-row: auto; }
}

@media (max-width: 781px) {

	.gaia-bento-rows {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: 15rem;
		grid-auto-rows: 10rem;
	}

	.gaia-bento-rows > li:nth-child(n) { grid-column: span 1; grid-row: auto; }

	.gaia-bento-rows > li:nth-child(1) { grid-column: span 2; }

	.gaia-grid-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	.gaia-grid-3-tall { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 15rem; }
}

@media (max-width: 480px) {

	.gaia-grid-3-tall { grid-template-columns: minmax(0, 1fr); }
}

/* Carte d'article blanche : image au bord, titre serré dessous. */
.wp-block-post-template.gaia-grid-5 > li > .wp-block-group,
.wp-block-post-template.gaia-picks > li > .wp-block-group {
	height: 100%;
	overflow: hidden;
}

.wp-block-post-template.gaia-grid-5 .wp-block-post-title,
.wp-block-post-template.gaia-picks .wp-block-post-title {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* Liste de titres à pastille, séparés de filets (colonne « à ne pas manquer »). */
.wp-block-post-template.gaia-ruled-titles > li {
	padding-block: var(--wp--preset--spacing--20);
	border-bottom: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--border);
}

.wp-block-post-template.gaia-ruled-titles > li:last-child { border-bottom: 0; }

/* La grande carte de la mosaïque prend un titre au cran supérieur. */
.gaia-bento-rows > li:first-child .wp-block-post-title { font-size: var(--wp--preset--font-size--xl); }

/* Une cellule de grille ne prend pas la marge de flux du cœur (cartes décalées d'une rangée à l'autre). */
.wp-block-post-template:is(.gaia-bento-rows, .gaia-grid-5, .gaia-grid-3-tall, .gaia-picks) > li {
	margin: 0;
}

/* La pastille garde sa largeur devant un titre long. */
.wp-block-post-template.gaia-ruled-titles .wp-block-post-terms {
	flex-shrink: 0;
}

/* Titre de carte dense : deux lignes à interligne 1.4, comme un média d'actualité. */
.wp-block-post-template.gaia-grid-5 .wp-block-post-title {
	line-height: 1.4;
}

/*
 * Repli en carrousel au palier téléphone (socle 3.34.3) : une grille marquée gaia-swipe-mobile
 * cesse de s'empiler sous 481 px et défile à l'horizontale, une carte et un bout de la suivante.
 */
@media (max-width: 480px) {

	.wp-block-post-template.gaia-swipe-mobile {
		grid-template-columns: none;
		grid-template-rows: none;
		grid-auto-flow: column;
		grid-auto-columns: 78%;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		padding-bottom: var(--wp--preset--spacing--20);
	}

	.wp-block-post-template.gaia-swipe-mobile > li:nth-child(n) {
		grid-column: auto;
		grid-row: auto;
		scroll-snap-align: start;
	}

	.wp-block-post-template.gaia-grid-5.gaia-swipe-mobile { grid-auto-columns: 62%; }
}

/* Liste de dossier : une ligne filetée par article, vignette à gauche (dossiers d'accueil). */
.wp-block-post-template.gaia-dossier-liste {
	margin-block: var(--wp--preset--spacing--40);
	padding: 0;
	list-style: none;
}

.wp-block-post-template.gaia-dossier-liste > li {
	margin: 0;
	padding-block: var(--wp--preset--spacing--30);
	border-block-start: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--border);
}

.wp-block-post-template.gaia-dossier-liste > li:last-child {
	border-block-end: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--border);
}

.wp-block-post-template.gaia-dossier-liste .wp-block-post-featured-image {
	flex: none;
	margin: 0;
}

.wp-block-post-template.gaia-dossier-liste .wp-block-post-title {
	margin: 0;
	line-height: 1.3;
}

.wp-block-post-template.gaia-dossier-liste .wp-block-post-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.wp-block-post-template.gaia-dossier-liste .wp-block-post-title a:hover {
	color: var(--wp--preset--color--accent);
}

/* Rangées numérotées (pattern posts-numbered-thumbs, socle 3.36.0) */
.wp-block-post-template.gaia-numbered-rows { counter-reset: gaia-num; }

.wp-block-post-template.gaia-numbered-rows > li { counter-increment: gaia-num; }

.wp-block-post-template.gaia-numbered-rows .gaia-numbered-rows__row::before { content: counter(gaia-num, decimal-leading-zero); flex: 0 0 4.5rem; font-family: var(--wp--preset--font-family--serif); font-size: 1.75rem; font-weight: 500; line-height: 1; color: var(--wp--preset--color--primary); }

.wp-block-post-template.gaia-numbered-rows .wp-block-post-featured-image { flex-shrink: 0; }

.wp-block-post-template.gaia-numbered-rows .gaia-numbered-rows__row > .wp-block-group { min-width: 0; }

@media (max-width: 640px) {

	.wp-block-post-template.gaia-numbered-rows .gaia-numbered-rows__row::before { flex-basis: 2.75rem; font-size: 1.25rem; }

	.wp-block-post-template.gaia-numbered-rows .wp-block-post-featured-image { width: 5rem !important; flex-basis: 5rem !important; }

	.wp-block-post-template.gaia-numbered-rows .gaia-numbered-rows__excerpt { display: none; }
}

/*
 * Cartes d'archive (gabarit archive-couverture, socle 3.37.0) : trois colonnes, deux sous
 * 1023 px, une sous 640 px ; la carte entière se clique par le lien du titre.
 */
.gaia-term-list > .wp-block-categories {
	margin-bottom: var(--wp--preset--spacing--50);
}

.gaia-term-grid .wp-block-post-template.is-layout-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
}

.gaia-term-grid .gaia-term-card {
	position: relative;
	height: 100%;
}

.gaia-term-grid .gaia-term-card > * {
	margin-block: 0;
}

.gaia-term-grid .gaia-term-card .wp-block-post-featured-image {
	overflow: hidden;
	margin-bottom: var(--wp--preset--spacing--30) !important;
	border-radius: var(--wp--custom--radius--lg);
	background-color: var(--wp--preset--color--surface);
}

.gaia-term-grid .gaia-term-card__rubrique {
	position: relative;
	z-index: 1;
}

.gaia-term-grid .gaia-term-card__rubrique a {
	color: inherit;
	text-decoration: none;
}

.gaia-term-grid .gaia-term-card__title {
	margin-block: var(--wp--preset--spacing--20) !important;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.gaia-term-grid .gaia-term-card__title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.gaia-term-grid .gaia-term-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.gaia-term-grid .gaia-term-card:hover .gaia-term-card__title a {
	color: var(--wp--preset--color--secondary);
}

.gaia-term-grid .gaia-term-card__meta {
	text-transform: uppercase;
}

.gaia-term-grid .gaia-term-card__meta > * {
	margin: 0;
}

@media (max-width: 1023px) {

	.gaia-term-grid .wp-block-post-template.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {

	.gaia-term-grid .wp-block-post-template.is-layout-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}
