/*
 * SCCT — Pages catégorie articles
 * Chargé automatiquement par le plugin scct-pilote-et-voiture.php (pas le customizer).
 * body.scct-category-grid-fix : ajouté sur les archives catégorie en mode grille.
 */

/* --- Grille colonnes : neutralise floats/clear du thème Newscrunch --- */
body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper {
	align-items: start;
}

body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper .spnc-grid-catpost.spnc-post,
body.scct-category-grid-fix .spnc-category-page .spnc-grid-catpost:nth-child(n),
body.scct-category-grid-fix .spnc-category-page .blog-grid-view .spnc-grid-catpost:nth-child(n) {
	float: none !important;
	clear: none !important;
}

/* Tablette : 2 colonnes (repli sans JS ou avant init masonry) */
@media (min-width: 551px) and (max-width: 1100px) {
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 20px;
		row-gap: 20px;
		width: 100%;
		box-sizing: border-box;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-grid-catpost.spnc-post,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-first-catpost {
		grid-column: auto;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
		float: none !important;
		clear: none !important;
		margin: 0 !important;
		padding: 0 !important;
		align-self: start !important;
		height: auto !important;
		box-sizing: border-box;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-grid-catpost.spnc-post:nth-child(odd),
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-grid-catpost.spnc-post:nth-child(even) {
		padding: 0 !important;
	}
}

/* Desktop : 3 colonnes (repli sans JS ou avant init masonry) */
@media (min-width: 1101px) {
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) {
		display: grid !important;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		column-gap: 14px;
		row-gap: 20px;
		width: 100%;
		box-sizing: border-box;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-grid-catpost.spnc-post,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-first-catpost {
		grid-column: auto;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
		float: none !important;
		clear: none !important;
		margin: 0 !important;
		padding: 0 !important;
		align-self: start !important;
		height: auto !important;
		box-sizing: border-box;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-grid-catpost.spnc-post:nth-child(odd),
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper:not(.scct-masonry-active) > .spnc-grid-catpost.spnc-post:nth-child(even) {
		padding: 0 !important;
	}
}

/* Masonry JS (tablette / desktop) — après les règles grille pour priorité cascade */
@media (min-width: 551px) {
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper.scct-masonry-active {
		display: block !important;
		position: relative;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper.scct-masonry-active > .scct-masonry-item {
		position: absolute;
		width: var(--scct-masonry-width) !important;
		max-width: var(--scct-masonry-width) !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		float: none !important;
		clear: none !important;
		height: auto !important;
		box-sizing: border-box;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper.scct-masonry-active > .scct-masonry-item .spnc-post-wrap,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper.scct-masonry-active > .scct-masonry-item .spnc-post-format-wrapper,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper.scct-masonry-active > .scct-masonry-item .spnc-post-content,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper.scct-masonry-active > .scct-masonry-item .spnc-content-wrapper,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper.scct-masonry-active > .scct-masonry-item .spnc-post-wrapper {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		box-sizing: border-box;
	}
}

/* --- Fallback hero .spnc-first-catpost (si template content-first encore utilisé) --- */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost {
	position: relative;
	margin-bottom: 0 !important;
	background: transparent !important;
	width: 100%;
	float: none !important;
	clear: none !important;
	box-sizing: border-box;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post {
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: auto auto auto auto auto;
	grid-template-areas:
		"image"
		"tags"
		"title"
		"desc"
		"footer";
	align-content: start;
	position: relative;
	padding: 12px 12px 11px !important;
	box-shadow: 0 0 8px 2px rgba(23, 23, 35, 0.05) !important;
	overflow: visible;
	background: #fff;
	height: auto;
	box-sizing: border-box;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-img {
	grid-area: image;
	height: auto !important;
	overflow: hidden;
	position: relative;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-overlay {
	display: none !important;
}

/* Remonte titre + texte au niveau grille ; pastilles partagent la cellule image */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-content,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-content-wrapper,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-wrapper,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-header,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-content,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta {
	display: contents;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-content-wrapper {
	position: static !important;
	max-width: none !important;
	width: auto !important;
	padding: 0 !important;
	background: transparent !important;
	bottom: auto !important;
	right: auto !important;
	margin: 0 !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-header {
	border-bottom: none !important;
}

/* Pastilles sur l’image — même cellule grille que .spnc-post-img */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-header > .spnc-entry-meta {
	grid-area: image;
	align-self: start;
	justify-self: start;
	position: relative !important;
	top: auto !important;
	left: auto !important;
	z-index: 5 !important;
	margin: 14px !important;
	padding: 0 !important;
	display: flex !important;
	flex-wrap: wrap;
	gap: 6px;
	width: auto;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-title {
	grid-area: title;
	margin-bottom: 15px;
	line-height: 1;
	padding: 0 20px 0;
	background-color: #fff;
	box-sizing: border-box;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post:not(:has(.spnc-tag-links)) .spnc-entry-title {
	padding-top: 20px;
}

/* Mots-clés : même emplacement et style que .spnc-grid-catpost .tag-links */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-tag-links {
	grid-area: tags;
	display: block !important;
	margin-bottom: 10px;
	padding: 20px 20px 0;
	background-color: #fff;
	box-sizing: border-box;
	color: #000;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-tag-links a {
	font-size: 14px;
	font-weight: 400;
	color: #6c6c6f !important;
	font-family: "Inter", sans-serif;
	text-transform: capitalize;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-tag-links i {
	font-size: 14px;
	padding-right: 3px;
	color: #d20000 !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-cat-links a,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-header > .spnc-entry-meta .spnc-cat-links a {
	font-size: 0.875rem !important;
	color: #fff !important;
	padding: 6px 12px;
	line-height: 1;
	text-transform: none !important;
	background: #d20000 !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-cat-links a:hover,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-cat-links a:focus,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-header > .spnc-entry-meta .spnc-cat-links a:hover,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-header > .spnc-entry-meta .spnc-cat-links a:focus {
	color: #fff !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-cat-links a:last-child::after {
	display: none !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-header > .spnc-entry-meta .spnc-cat-links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

/* Résumé : même style que .spnc-grid-catpost ; trait séparateur après l’extrait */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta p.spnc-description {
	grid-area: desc;
	align-self: start;
	padding: 0 20px 8px;
	background-color: #fff;
	box-sizing: border-box;
	font-size: 1rem;
	font-weight: 400;
	font-family: "Poppins", sans-serif;
	color: #404040 !important;
	word-break: break-all;
	margin-bottom: 0;
	padding-bottom: 16px;
	border-bottom: 1px solid #d7d7d7;
	width: 100%;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-title a {
	color: #000 !important;
	font-size: 1.25rem !important;
	font-weight: 700;
	font-family: "Inter", sans-serif;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Survol titre : rouge SCCT + barre a_effect2 (comme les articles grille) */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-title a.a_effect2 {
	position: relative;
	padding-bottom: 5px;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-title a.a_effect2::before {
	background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%) !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-title a.a_effect2:is(:hover, :focus) {
	color: #d20000 !important;
}

/* Date à côté de « Lire la suite » */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta > .spnc-entry-meta {
	display: contents;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta .spnc-author,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta .spnc-read-time {
	display: none !important;
}

/* Pied de carte : juste après le trait du résumé (pas en bas de carte) */
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta .spnc-date {
	grid-area: footer;
	justify-self: end;
	align-self: start;
	margin: 20px 20px 0 0 !important;
	padding: 0 !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post .spnc-more-link,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta .spnc-more-link {
	grid-area: footer;
	justify-self: start;
	align-self: start;
	margin: 20px 0 0 20px !important;
	padding: 6px 18px !important;
	font-family: "Poppins", sans-serif !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	color: #000 !important;
	background-color: transparent !important;
	border: 1px solid #d7d7d7 !important;
	border-radius: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-sizing: border-box !important;
	float: none !important;
	width: auto !important;
	max-width: calc(100% - 120px);
	min-height: 0 !important;
	height: auto !important;
	text-align: center !important;
	text-transform: none !important;
	vertical-align: middle !important;
	-webkit-box-orient: unset !important;
	-webkit-line-clamp: unset !important;
	overflow: visible !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-more-link:hover,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-more-link:focus {
	background-color: #d20000 !important;
	color: #fff !important;
	border-color: #d20000 !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta .spnc-date a,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-footer-meta .spnc-date .display-time {
	font-size: 0.875rem;
	font-weight: 600;
	color: #6c6c6f !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-entry-meta i {
	color: #d20000 !important;
}

/* Pastilles catégories : texte blanc (1er article + grille) */
.spnc-category-page .spnc-grid-catpost .spnc-post-format-wrapper .spnc-entry-meta .spnc-cat-links a,
.spnc-category-page .spnc-grid-catpost .spnc-post-format-wrapper .spnc-entry-meta .spnc-cat-links a:hover,
.spnc-category-page .spnc-grid-catpost .spnc-post-format-wrapper .spnc-entry-meta .spnc-cat-links a:focus {
	color: #fff !important;
}

.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .sticky-post-icon {
	display: none !important;
}

/* --- Vignettes : image entière, contrainte à la largeur de colonne --- */
.spnc-category-page .spnc-grid-catpost .spnc-post-wrap,
.spnc-category-page .spnc-grid-catpost .spnc-post-format-wrapper,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-img {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.spnc-category-page .spnc-grid-catpost .spnc-post-thumbnail,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-thumbnail {
	height: auto !important;
	min-height: 0;
	width: 100%;
	max-width: 100%;
	overflow: hidden;
	background-color: #f5f5f5;
	box-sizing: border-box;
}

.spnc-category-page .spnc-grid-catpost .spnc-post-thumbnail img,
.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-thumbnail img {
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	max-height: none;
	object-fit: contain;
	object-position: center;
	position: static;
	display: block;
	box-sizing: border-box;
}

/* Cadre blanc harmonisé : hauteur au contenu (pas d’espace vide en bas de carte) */
.spnc-category-page .spnc-grid-catpost.spnc-post > .spnc-post-wrap {
	background-color: #fff;
	padding: 12px 12px 3px;
	box-shadow: 0 0 8px 2px rgba(23, 23, 35, 0.05);
	box-sizing: border-box;
	height: auto;
}

.spnc-category-page .spnc-grid-catpost.spnc-post {
	height: auto;
}

body.scct-category-grid-fix .spnc-category-page .spnc-grid-catpost .spnc-content-wrapper {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	margin-bottom: 0 !important;
}

@media (max-width: 550px) {
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper {
		display: block !important;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper > .spnc-grid-catpost.spnc-post,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper > .spnc-first-catpost {
		float: none !important;
		clear: none !important;
		width: 100% !important;
		padding: 0 !important;
		margin: 0 0 20px !important;
	}

	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper > .spnc-grid-catpost.spnc-post:last-child,
	body.scct-category-grid-fix .spnc-category-page .spnc-blog-cat-wrapper > .spnc-first-catpost:last-child {
		margin-bottom: 0 !important;
	}

	.spnc-category-page .spnc-blog-cat-wrapper .spnc-first-catpost .spnc-post-img {
		height: auto !important;
	}
}

/* Défilement infini : masquer la pagination, indicateur de chargement */
body.scct-category-infinite .pagination,
body.scct-category-infinite .spnc-navigation.spnc-pagination,
body.scct-category-infinite .nav-links {
	display: none !important;
}

.scct-category-infinite-sentinel {
	clear: both;
	width: 100%;
	padding: 24px 0 40px;
	text-align: center;
	box-sizing: border-box;
}

.scct-category-infinite-loader {
	display: inline-block;
	font-family: "Poppins", sans-serif;
	font-size: 14px;
	color: #6c6c6f;
}

.scct-category-infinite-loader.is-loading::after {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-left: 8px;
	vertical-align: middle;
	border: 2px solid #d7d7d7;
	border-top-color: #d20000;
	border-radius: 50%;
	animation: scct-category-infinite-spin 0.7s linear infinite;
}

@keyframes scct-category-infinite-spin {
	to {
		transform: rotate(360deg);
	}
}

.scct-category-infinite-sentinel.scct-category-infinite-done {
	display: none;
}
