/**
 * Single Post (Article)
 */

/* ========================================
   HERO ARTICLE (breadcrumb + ri-titre-texte + thumbnail)
   ======================================== */


.ri-single-post .post-hero {
	background-color: var(--ri-color-grey-mid);
	padding-bottom: var(--ri-block-padding-xl);
}

.ri-single-post .post-hero-breadcrumb {
	padding: 24px 24px 24px 64px;
}

.ri-single-post .post-hero-titre-texte {
	background-color: transparent;
	padding-bottom: 0;
}

/* Feature image : bande grise 125px (prolonge le hero), blanc dessous */
.ri-single-post .post-hero-thumbnail {
	background: linear-gradient(to bottom, var(--ri-color-grey-mid) 125px, var(--ri-color-white) 125px);
}

.ri-single-post .post-hero-thumbnail .post-hero-img {
	display: block;
	width: 100%;
	height: 600px;
	object-fit: cover;
}


/* ========================================
   nova + open-inno : breadcrumb commun
   ======================================== */

.ri-single-post.is-nova .ri-breadcrumb,
.ri-single-post.is-open-inno .ri-breadcrumb {
	padding: 24px 24px 24px 64px;
	background-color: var(--ri-color-white);
	margin-bottom: var(--ri-space-xl);
}

/* open-inno : accent bordeaux sur ri-titre-texte */
.ri-single-post.is-open-inno .ri-titre-texte .titre .is-accent {
	color: var(--ri-color-open-inno);
}

/* nova : accent violet sur ri-titre-texte */
.ri-single-post.is-nova .ri-titre-texte .titre .is-accent {
	color: #4f355e;
}

/* ========================================
   Date de publication (nova)
   ======================================== */

.ri-single-post .post-date {
	margin: 0;
	font: 400 12px/1 var(--ri-font-1);
	color: var(--ri-color-grey);
}

.ri-single-post.is-nova .post-header,
.ri-single-post.is-open-inno .post-header {
	margin-bottom: 16px;
}

/* ========================================
   Contenu de l'article
   ======================================== */

.ri-single-post .post-content {
	padding-block-start: 0;
	padding-block-end: var(--ri-space-xl);
}

.ri-single-post:not(.is-nova):not(.is-open-inno) .post-content {
	padding-block-start: 48px;
}

.ri-single-post .post-intro {
	margin: 0;
	font: 500 24px/1.4 var(--ri-font-1);
}

.ri-single-post .post-date + .post-intro {
	margin-top: var(--ri-space-md);
}

.ri-single-post .post-body a {
	text-decoration: underline;
	color: var(--ri-color-teal);
}

/* Layout sans sidebar — contenu limité à 954px */
.ri-single-post .post-body {
	max-width: 954px;
	display: flex;
	flex-direction: column;
}

/* Espacement entre paragraphes : 24px */
.ri-single-post .post-body p {
	margin-block: 0;
}

.ri-single-post .post-body > p + p {
	margin-top: var(--ri-space-md);
}

/* Listes : même espacement que les p entre eux */
.ri-single-post .post-body .wp-block-list,
.ri-single-post .post-body ul,
.ri-single-post .post-body ol {
	margin-block: var(--ri-space-md);
}

.ri-single-post .post-body .wp-block-list {
	list-style: none;
	padding-left: 40px;
}

.ri-single-post .post-body .wp-block-list li {
	font: 400 16px/24px var(--ri-font-1);
	color: var(--ri-color-teal);
	padding-left: 24px;
	position: relative;
}

.ri-single-post .post-content .post-body > h2 {
	font-size: var(--ri-size-text-body-xl);
}

.ri-single-post .post-body .wp-block-list li + li {
	margin-top: var(--ri-space-sm);
}

.ri-single-post .post-body .wp-block-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 8px;
	width: 8px;
	height: 8px;
	background-color: var(--ri-color-yellow);
}

/* p suivi d'une liste : réutilise l'espacement md */
.ri-single-post .post-body p + .wp-block-list,
.ri-single-post .post-body p + ul,
.ri-single-post .post-body p + ol {
	margin-top: var(--ri-space-md);
}

/* Blocs : 48px de marge basse */
.ri-single-post .post-body > *:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
}

.ri-single-post .post-body > *:not(p):not(.wp-block-list):not(ul):not(ol):not(.ri-chiffre-cle):not(:last-child) {
	margin-top: 0;
	margin-bottom: var(--ri-space-xl);
}

/* p suivi d'un bloc : 48px de marge basse */

.ri-single-post .post-body p:has(+ :not(p):not(.wp-block-list):not(ul):not(ol):not(.ri-chiffre-cle)) {
	margin-bottom: var(--ri-space-xl);
}

.ri-single-post .ri-texte-image .ri-container,
.ri-single-post .ri-video-youtube .ri-container {
	max-width: 100%;
	margin: 0;
	width: 100%;
}

.ri-single-post .post-body > .ri-carrousel-images,
.ri-single-post .post-body > .ri-texte-image,
.ri-single-post .post-body > .ri-lien-telechargement {
	padding-block: 0;
}

.ri-single-post .post-body > .ri-texte-image > .ri-container {
	width: 100%;
}


.ri-single-post .post-thumbnail {
	margin: 0;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.ri-single-post .post-thumbnail img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/* Layout avec sidebar — 2 colonnes */
@media (min-width: 951px) {

	.ri-single-post .post-content.has-sidebar {
		display: grid;
		grid-template-columns: 1fr 302px;
		gap: 24px;
		align-items: stretch;
	}
}

.ri-single-post .post-content.has-sidebar .post-body {
	max-width: none;
	min-width: 0;
}

/* ========================================
    Vidéo YouTube (hors nova)
   ======================================== */

.ri-single-post .ri-video-youtube {
	padding-block: 0;
}

.ri-single-post .ri-video-youtube .player-wrapper {
	max-height: 445px;
}

.ri-video-youtube .play-btn img {
	width: 80px;
	height: 80px;
}


/* ========================================
   Sidebar (commune nova + partage)
   ======================================== */

.ri-single-post .sidebar-box {
	position: sticky;
	top: 24px;
	display: flex;
	flex-direction: column;
	gap: 40px;
	padding: 40px 24px;
	background-color: var(--ri-color-grey-mid);
	overflow: hidden;
}


.ri-single-post .sidebar-text {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.ri-single-post .sidebar-titre {
	margin: 0;
	font: 700 20px/1.2 var(--ri-font-1);
}

.ri-single-post .sidebar-texte {
	margin: 0;
	font: 400 16px/1.7 var(--ri-font-1);
}

.ri-single-post .sidebar-cta-wrapper {
	display: flex;
	justify-content: flex-end;
}

.ri-single-post .sidebar-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background-color: var(--ri-color-yellow);
	color: var(--ri-color-violet-dark);
	font: 700 15.4px/1 var(--ri-font-1);
	text-decoration: none;
	transition: opacity var(--ri-transition-base);
}

.ri-single-post .sidebar-cta:hover {
	opacity: 0.85;
}

/* ========================================
   Sidebar partage (hors nova)
   ======================================== */

.ri-single-post .sidebar-share {
	display: flex;
	flex-direction: column;
	gap: 40px;
	padding: 40px 24px;
	background-color: var(--ri-color-grey-soft);
	overflow: hidden;
}

.ri-single-post .sidebar-share-text {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.ri-single-post .sidebar-share-titre {
	margin: 0;
	font: 700 20px/1.2 var(--ri-font-1);
}

.ri-single-post .sidebar-share-desc {
	margin: 0;
	font: 400 16px/1.5 var(--ri-font-1);
	color: var(--ri-color-teal);
}

.ri-single-post .sidebar-share-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.ri-single-post .sidebar-share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background-color: var(--ri-color-yellow);
	color: var(--ri-color-teal);
	font: 700 15.4px/1 var(--ri-font-1);
	text-decoration: none;
	transition: opacity var(--ri-transition-base);
}

.ri-single-post .sidebar-share-btn:hover {
	opacity: 0.85;
}

/* ========================================
   Responsive
   ======================================== */

@media (max-width: 782px) {

	.ri-single-post .post-body > .ri-carrousel-images {
		width: calc(100% + var(--ri-container-padding));
	}

	.ri-single-post .post-hero-breadcrumb {
		padding: 16px;
	}

	.ri-single-post .post-body > p,
	.ri-single-post .post-body > .post-intro,
	.ri-single-post .post-body > .wp-block-list li {
		font-size: 14px;
	}

	.ri-single-post .post-body > .wp-block-list {
		padding-left: 16px;
	}

	/* Listes mobile */
	.ri-single-post .post-body > .wp-block-list,
	.ri-single-post .post-body > ul,
	.ri-single-post .post-body > ol {
		margin-block: var(--ri-space-sm);
	}

	.ri-single-post .post-body > p + .wp-block-list,
	.ri-single-post .post-body > p + ul,
	.ri-single-post .post-body > p + ol {
		margin-top: var(--ri-space-sm);
	}

	/* p suivi d'un bloc : 24px mobile */
	.ri-single-post .post-body > p:has(+ :not(p):not(.wp-block-list):not(ul):not(ol)) {
		margin-bottom: var(--ri-space-md);
	}

	/* Blocs : 24px mobile */
	.ri-single-post .post-body > *:not(p):not(.wp-block-list):not(ul):not(ol):not(div) {
		margin-bottom: var(--ri-space-md);
	}

	.ri-single-post .post-body p.post-date {
		font-size: 12px;
		margin-bottom: 12px;
	}

	.ri-single-post .post-hero-thumbnail .post-hero-img {
		height: 160px;
	}

	.ri-single-post .post-header {
		padding-top: 24px;
		margin-bottom: 80px;
	}

	.ri-single-post .ri-titre-texte .surtitre {
		margin-bottom: 12px;
	}

	.ri-single-post .ri-breadcrumb {
		display: none;
	}

	/* Sidebar standard cachée sur mobile */
	.ri-single-post:not(.is-nova):not(.is-open-inno) .post-sidebar {
		display: none;
	}

	.ri-single-post .post-content {
		padding-block-end: var(--ri-space-sm);
	}

	.ri-video-youtube .play-btn img {
		width: 40px;
		height: 40px;
	}

}

/* ========================================
   Sidebar mobile nova / open-inno (≤ 950px)
   ======================================== */

@media (max-width: 950px) {

	.ri-single-post.is-nova .post-sidebar,
	.ri-single-post.is-open-inno .post-sidebar {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 100;
		transition: transform var(--ri-transition-slow);
	}

	.ri-single-post.is-nova .post-sidebar.is-hidden,
	.ri-single-post.is-open-inno .post-sidebar.is-hidden {
		transform: translateY(100%);
	}

	.ri-single-post.is-nova .sidebar-box,
	.ri-single-post.is-open-inno .sidebar-box {
		position: static;
		flex-direction: row;
		align-items: center;
		padding: 16px;
		gap: 40px;
		background-color: var(--ri-color-grey-soft);
	}

	.ri-single-post.is-nova .sidebar-text,
	.ri-single-post.is-open-inno .sidebar-text {
		flex: 1 1 0;
	}

	.ri-single-post.is-nova .sidebar-titre,
	.ri-single-post.is-open-inno .sidebar-titre {
		font: 700 16px / 1.2 var(--ri-font-1);
	}

	.ri-single-post.is-nova .sidebar-texte,
	.ri-single-post.is-open-inno .sidebar-texte {
		display: none;
	}

	.ri-single-post.is-nova .sidebar-cta-wrapper,
	.ri-single-post.is-open-inno .sidebar-cta-wrapper {
		justify-content: flex-end;
		flex-shrink: 0;
	}

}