/*
 * Reskin "Fil d'actualités" — First Master Class
 * ------------------------------------------------
 * Toutes les règles sont scopées à body.directory.activity (page
 * fil-dactualites uniquement) SAUF les blocs déjà spécifiques par nature
 * (#buddypress, .fmx-feed-resume, .fmx-nav, .fmx-cards, .activity-list…)
 * qui n'existent que sur cette page ou dans ses widgets dédiés.
 *
 * Sélecteurs vérifiés contre le DOM réel généré par BuddyBoss Nouveau +
 * le plugin/widget "fmx-feed" déjà en place sur la préprod (widgets
 * widget_fmx_feed_nav / widget_fmx_feed_cards, bloc .fmx-feed-resume
 * branché sur la progression LearnDash réelle). On restyle cette couche
 * existante plutôt que de la reconstruire : le state (progression, agenda,
 * parcours, posts, likes, commentaires) reste 100% piloté par BuddyBoss /
 * LearnDash côté PHP, on ne touche qu'au CSS.
 *
 * Remplace entièrement l'ancien reskin fmx-feed (palette bleu/gris, radius
 * 4px, police mono) — voir DEPLOIEMENT.md pour retirer l'ancien CSS custom.
 */

body.directory.activity {
	background: var(--fmc-bg);
	font-family: var(--fmc-font);
}

body.directory.activity,
body.directory.activity input,
body.directory.activity textarea,
body.directory.activity button,
body.directory.activity select {
	font-family: var(--fmc-font);
}

body.directory.activity h1,
body.directory.activity h2,
body.directory.activity h3,
body.directory.activity h4,
body.directory.activity h5,
body.directory.activity h6 {
	font-family: var(--fmc-font);
	font-weight: 400; /* le design system FMC n'utilise jamais le gras sur les titres */
}

/* ==========================================================================
   1. (Header — volontairement absent : le header reste celui du thème,
      identique sur toutes les pages. Ne pas ajouter de règle .site-header /
      #primary-navbar / #site-logo ici, voir fmx-static-header.php pour tout
      ce qui touche au header.)
   ========================================================================== */

/* ==========================================================================
   2. Bandeau "Reprendre" — .fmx-feed-resume (branché sur la vraie
      progression LearnDash : titre de leçon, % réel, lien "Continuer")
   ========================================================================== */

.fmx-feed-resume {
	background: var(--fmc-navy);
	border-radius: var(--fmc-radius-hero);
	padding: 28px 32px;
	margin: 0 0 20px;
	position: relative;
	overflow: hidden;
	color: #fff;
	font-family: var(--fmc-font);
}

/* Chevrons rouge/navy — uniquement sur ce bloc navy plein */
.fmx-feed-resume::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 220px;
	height: 24px;
	background-image: var(--fmc-chevrons);
	background-repeat: repeat-x;
	opacity: .9;
	pointer-events: none;
}

.fmx-feed-resume .fmx-eyebrow {
	font-size: var(--fmc-fs-eyebrow);
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--fmc-navy-text-light);
	margin: 0 0 8px;
}

.fmx-feed-resume .fmx-feed-resume__title {
	font-size: var(--fmc-fs-hero);
	font-weight: 400;
	color: #fff;
	margin: 0 0 6px;
}

.fmx-feed-resume .fmx-feed-resume__meta {
	font-size: var(--fmc-fs-ui);
	color: var(--fmc-navy-text-light);
	margin: 0 0 18px;
}

.fmx-feed-resume .fmx-progress {
	background: #1F4B66;
	border-radius: var(--fmc-radius-pill);
	height: 8px;
	overflow: hidden;
	margin: 0 0 20px;
	max-width: 420px;
}

.fmx-feed-resume .fmx-progress__bar {
	display: block;
	height: 100%;
	background: var(--fmc-red);
	border-radius: var(--fmc-radius-pill);
}

.fmx-feed-resume .fmx-feed-resume__actions {
	margin: 0;
}

.fmx-feed-resume .fmx-btn.fmx-btn--solid {
	display: inline-flex;
	align-items: center;
	background: var(--fmc-red);
	color: #fff;
	border-radius: var(--fmc-radius-pill);
	padding: 10px 22px;
	font-size: var(--fmc-fs-ui);
	text-decoration: none;
	transition: background-color .15s ease;
}

.fmx-feed-resume .fmx-btn.fmx-btn--solid:hover {
	background: var(--fmc-red-hover);
}

/* ==========================================================================
   3. Filtres par sujet (chips pilule) + tri
   ========================================================================== */

body.directory.activity .activity-topic-selector ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	padding: 0;
	margin: 0 0 16px;
}

body.directory.activity .activity-topic-selector li a,
body.directory.activity .activity-topic-selector li.bb-topic-selector-item .bb-topic-selector-link {
	display: inline-block;
	padding: 8px 16px;
	border-radius: var(--fmc-radius-pill);
	background: var(--fmc-surface);
	border: 1px solid var(--fmc-border);
	color: var(--fmc-navy-text);
	font-size: var(--fmc-fs-ui);
	text-decoration: none;
	transition: background-color .15s ease, border-color .15s ease;
}

body.directory.activity .activity-topic-selector li a:hover,
body.directory.activity .activity-topic-selector li.bb-topic-selector-item .bb-topic-selector-link:hover {
	border-color: var(--fmc-border-hover);
}

body.directory.activity .activity-topic-selector li.selected a,
body.directory.activity .activity-topic-selector li.bb-topic-selector-item.selected .bb-topic-selector-link {
	background: var(--fmc-navy);
	border-color: var(--fmc-navy);
	color: #fff;
}

body.directory.activity .bb-subnav-filters-container .subnav-filters-opener {
	border-radius: var(--fmc-radius-pill);
	background: var(--fmc-surface);
	border: 1px solid var(--fmc-border);
	color: var(--fmc-navy-text);
	font-family: var(--fmc-font);
	font-size: var(--fmc-fs-ui);
	padding: 8px 14px;
}

/* ==========================================================================
   4. Boîte de publication (composer BuddyBoss standard, si utilisée)
   ========================================================================== */

body.directory.activity #bp-nouveau-activity-form textarea,
body.directory.activity .bp-activity-form-privacy,
body.directory.activity .activity-share-form {
	border-radius: var(--fmc-radius-card);
}

body.directory.activity .activity-share-form .aw-whats-new-submit,
body.directory.activity input[type="submit"].aw-whats-new-submit {
	background: var(--fmc-navy);
	border-color: var(--fmc-navy);
	border-radius: var(--fmc-radius-pill);
	color: #fff;
	font-family: var(--fmc-font);
}

body.directory.activity .activity-share-form .aw-whats-new-submit:hover {
	background: var(--fmc-navy-hover);
}

/* ==========================================================================
   5. Cartes de post — li.activity-item
   ========================================================================== */

body.directory.activity .activity-list.item-list.bp-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

body.directory.activity .activity-list > li.activity-item {
	background: var(--fmc-surface);
	border: 1px solid var(--fmc-border);
	border-radius: var(--fmc-radius-card);
	padding: 22px 24px;
	margin: 0 0 16px;
	box-shadow: none;
	transition: border-color .15s ease;
}

body.directory.activity .activity-list > li.activity-item:hover {
	border-color: var(--fmc-border-hover);
}

/* Avatar hexagonal dans chaque carte + fil de commentaires */
body.directory.activity .activity-avatar.item-avatar img.avatar,
body.directory.activity .ac-reply-avatar img.avatar,
body.directory.activity .activity-state_user__avatar img.avatar {
	border-radius: 0;
	clip-path: var(--fmc-hexagon);
}

body.directory.activity .bp-activity-head {
	display: flex;
	gap: 12px;
	align-items: flex-start;
}

body.directory.activity .activity-header p {
	margin: 0;
	font-size: var(--fmc-fs-ui);
	color: var(--fmc-navy-text);
	font-family: var(--fmc-font);
}

body.directory.activity .activity-header p a {
	color: var(--fmc-navy);
	font-weight: 400;
	text-decoration: none;
}

body.directory.activity .activity-header .time-since,
body.directory.activity .activity-header .activity-time-since {
	color: var(--fmc-navy-text-light);
	font-size: 13px;
}

/* Badge catégorie (pilule outline) — coloré selon le groupe/sujet */
body.directory.activity .activity-topic a {
	display: inline-block;
	margin-top: 6px;
	padding: 3px 10px;
	border-radius: var(--fmc-radius-pill);
	border: 1px solid currentColor;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .04em;
	text-decoration: none;
}

/* Contenu du post */
body.directory.activity .activity-content .activity-inner {
	font-family: var(--fmc-font);
	font-size: var(--fmc-fs-body);
	line-height: 1.6;
	color: #17324A;
	margin: 10px 0 0;
}

body.directory.activity .activity-content .activity-inner p:first-child {
	font-size: var(--fmc-fs-title);
	font-weight: 400;
	color: var(--fmc-navy);
}

/* Image de post (frame 16px radius) */
body.directory.activity .activity-feature-image img,
body.directory.activity .bb-activity-media-wrapper img,
body.directory.activity .activity-inner img {
	border-radius: var(--fmc-radius-frame);
	border: 1px solid var(--fmc-border);
}

/* Footer : J'aime / Commentaire en pilule */
body.directory.activity .bp-generic-meta.activity-meta a.button {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border-radius: var(--fmc-radius-pill);
	border: 1px solid var(--fmc-border);
	background: var(--fmc-surface);
	color: var(--fmc-navy-text);
	padding: 7px 14px;
	font-size: 13px;
	font-family: var(--fmc-font);
}

body.directory.activity .bp-generic-meta.activity-meta a.button:hover {
	background: var(--fmc-chip-bg);
}

body.directory.activity .bp-generic-meta.activity-meta a.bp-like-button[data-pressed="true"] {
	background: var(--fmc-red);
	border-color: var(--fmc-red);
	color: #fff;
}

/* Fil de commentaires imbriqué : bulle grise */
body.directory.activity .ac-form .ac-textarea,
body.directory.activity .ac-form .ac-input {
	background: var(--fmc-bg);
	border-radius: var(--fmc-radius-card);
	border: 1px solid var(--fmc-border);
	font-family: var(--fmc-font);
}

body.directory.activity .activity-comments .acomment-content {
	background: var(--fmc-bg);
	border-radius: 16px;
	padding: 10px 14px;
}

/* Post système compact (ex: changement de photo de profil) */
body.directory.activity .activity-list > li.activity-item.activity_new_avatar,
body.directory.activity .activity-list > li.activity-item.activity_new_member {
	padding: 12px 18px;
}

body.directory.activity .activity-list > li.activity-item.activity_new_avatar .activity-avatar img.avatar,
body.directory.activity .activity-list > li.activity-item.activity_new_member .activity-avatar img.avatar {
	width: 34px;
	height: 34px;
}

/* ==========================================================================
   6. Sidebars réelles — widgets fmx-feed (nav gauche / cartes droite)
   ========================================================================== */

.widget_fmx_feed_nav,
.widget_fmx_feed_cards,
.widget_fmx_feed_note {
	background: var(--fmc-surface);
	border: 1px solid var(--fmc-border);
	border-radius: var(--fmc-radius-card);
	padding: 18px 20px;
	margin: 0 0 16px;
	font-family: var(--fmc-font);
}

.widget_fmx_feed_nav .widget-title,
.widget_fmx_feed_cards .widget-title,
.widget_fmx_feed_note .widget-title {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .08em;
	font-weight: 400;
	color: var(--fmc-navy-text-light);
	margin: 0 0 12px;
}

.fmx-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}

.fmx-nav__item {
	margin: 0 0 2px;
}

.fmx-nav__link {
	display: block;
	padding: 9px 12px;
	border-radius: var(--fmc-radius-nav);
	color: var(--fmc-navy-text);
	text-decoration: none;
	font-size: var(--fmc-fs-ui);
}

.fmx-nav__link:hover {
	background: var(--fmc-chip-bg);
	color: var(--fmc-navy);
}

.fmx-nav__item.is-active .fmx-nav__link {
	background: var(--fmc-navy);
	color: #fff;
}

.fmx-cards .fmx-card {
	border-radius: 14px;
	background: var(--fmc-bg);
	padding: 12px 14px;
	margin: 0 0 10px;
}

.fmx-cards .fmx-card:last-child {
	margin-bottom: 0;
}

.fmx-card__title a {
	color: var(--fmc-navy);
	text-decoration: none;
	font-size: var(--fmc-fs-ui);
}

.fmx-card__meta {
	color: var(--fmc-navy-text);
	font-size: 12.5px;
	margin: 4px 0 0;
}

.fmx-card__price {
	color: var(--fmc-red);
	font-size: 13px;
	margin: 4px 0 0;
}

/* Carte "webinaire" (agenda) : teinte claire au lieu de blanc */
#fmx_feed_cards-5 .fmx-card {
	background: var(--fmc-chip-bg);
}

.widget_fmx_feed_note .fmx-note a {
	color: var(--fmc-navy);
}

/* ==========================================================================
   7. (Panneau mobile bb-buddypanel — volontairement absent, même raison
      qu'en section 1 : c'est un élément du header, laissé au thème.)
   ========================================================================== */