/* =========================================================================
   RAINURE · le Salon (forum bbPress)
   Chargé seulement sur les pages du forum. Remplace la feuille de bbPress.
   ========================================================================= */

/* En-tête du Salon ------------------------------------------------------- */
.fb-salon { padding-bottom: clamp(56px, 8vw, 96px); }
.fb-salon-head {
	position: relative; overflow: hidden; isolation: isolate;
	padding-block: clamp(28px, 5vw, 64px) clamp(24px, 4vw, 40px);
	border-bottom: 3px solid var(--ink); margin-bottom: clamp(24px, 4vw, 40px);
	display: grid; gap: 14px; justify-items: start;
}
.fb-salon-head .fb-kicker { gap: 10px; }
.fb-salon-head__title {
	margin: 0; font-size: clamp(60px, 13vw, 180px) !important; font-weight: 900; line-height: .82; max-width: 13ch; text-wrap: balance;
}
.fb-salon-head[style*="--gc"] .fb-salon-head__title { color: var(--gc); }
[data-theme="dark"] .fb-salon-head[style*="--gc"] .fb-salon-head__title { color: color-mix(in oklab, var(--gc) 70%, #fff); }
.fb-salon-head__intro { margin: 0; max-width: 46ch; font-size: clamp(19px, 2vw, 23px); line-height: 1.4; color: var(--muted); }
.fb-salon-head__stats { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 28px; font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12.5px; text-transform: lowercase; letter-spacing: .005em; color: var(--muted); }
.fb-salon-head__stats strong { display: block; font-family: var(--font-display); font-weight: 900; font-size: clamp(44px, 5vw, 64px); line-height: .9; color: var(--ink); letter-spacing: 0; font-variant-numeric: tabular-nums; }
.fb-salon-head__disc { position: absolute; z-index: -1; width: min(46vw, 460px); right: -8%; top: 50%; translate: 0 -50%; opacity: .95; }
.fb-salon-head__disc .fb-vinyl { width: 100%; height: auto; }
@media (prefers-reduced-motion: no-preference) {
	.fb-salon-head__disc .fb-vinyl__spin { animation-duration: 9s; }
	.fb-salon-head__disc { animation: fb-roll-in 1.4s var(--ease) .2s both; }
}
@media (max-width: 800px) { .fb-salon-head__disc { width: 62vw; right: -30%; top: auto; bottom: -20%; translate: none; opacity: .35; } }

.fb-crumbs { display: flex; flex-wrap: wrap; gap: 6px 10px; font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12px; text-transform: lowercase; letter-spacing: .005em; color: var(--muted); }
.fb-crumbs .bbp-breadcrumb { display: contents; }
.fb-crumbs a { color: var(--muted); text-decoration: none; }
.fb-crumbs a:hover { color: var(--accent); }
.fb-crumbs .bbp-breadcrumb-current { color: var(--ink); }

/* bbPress ajoute son propre fil d'Ariane : l'en-tête du Salon en affiche déjà un. */
#bbpress-forums > .bbp-breadcrumb { display: none; }

/* Base -------------------------------------------------------------------- */
#bbpress-forums { font-size: 17px; }
#bbpress-forums ul, #bbpress-forums ol { list-style: none; margin: 0; padding: 0; }
#bbpress-forums a { color: var(--ink); text-decoration: none; }
#bbpress-forums a:hover { color: var(--accent); }
#bbpress-forums .hidden, #bbpress-forums .screen-reader-text.hidden { position: absolute !important; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }

/* Recherche du forum */
.bbp-search-form { margin-bottom: 24px; }
.bbp-search-form form > div { display: flex; gap: 8px; max-width: 520px; }
#bbp_search, #bbpress-forums input[type="text"], #bbpress-forums input[type="password"], #bbpress-forums input[type="email"], #bbpress-forums input[type="url"], #bbpress-forums textarea, #bbpress-forums select {
	width: 100%; background: var(--bg); color: var(--ink); border: 1px solid var(--line); border-radius: 8px;
	padding: 12px 14px; font: inherit; font-size: 17px; transition: border-color .2s ease, box-shadow .2s ease;
}
#bbpress-forums input:focus, #bbpress-forums textarea:focus, #bbpress-forums select:focus {
	outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent);
}
#bbpress-forums .button, #bbpress-forums button[type="submit"], #bbpress-forums input[type="submit"] {
	display: inline-flex; align-items: center; cursor: pointer; flex: none;
	background: var(--accent); color: var(--accent-ink); border: 0; border-radius: 999px; padding: .85rem 1.4rem;
	font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 13px; font-weight: 500; text-transform: lowercase; letter-spacing: .005em;
	transition: transform .25s var(--ease), box-shadow .25s ease;
}
#bbpress-forums .button:hover, #bbpress-forums button[type="submit"]:hover { transform: translateY(-2px); box-shadow: 0 10px 22px -12px var(--accent); }

/* Listes : canaux et discussions ---------------------------------------- */
.bbp-forums, .bbp-topics { border-top: 3px solid var(--ink); }
.bbp-forums .bbp-header, .bbp-topics .bbp-header, .bbp-forums .bbp-footer, .bbp-topics .bbp-footer, .bbp-replies .bbp-header, .bbp-replies .bbp-footer { display: none; }

#bbpress-forums .bbp-forums .bbp-body > ul, #bbpress-forums .bbp-topics .bbp-body > ul {
	position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 90px 90px minmax(0, 220px); gap: 8px 20px; align-items: center;
	padding: 22px 12px; border-bottom: 1px solid var(--line);
	transition: background .3s ease, padding .4s var(--ease);
}
#bbpress-forums .bbp-forums .bbp-body > ul::before, #bbpress-forums .bbp-topics .bbp-body > ul::before {
	content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent);
	transform: scaleY(0); transform-origin: top; transition: transform .45s var(--ease);
}
#bbpress-forums .bbp-forums .bbp-body > ul:hover, #bbpress-forums .bbp-topics .bbp-body > ul:hover { background: var(--paper); padding-left: 24px; }
#bbpress-forums .bbp-forums .bbp-body > ul:hover::before, #bbpress-forums .bbp-topics .bbp-body > ul:hover::before { transform: scaleY(1); }

.bbp-forum-info { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 14px; align-items: center; }
.fb-forum__dot { width: 16px; height: 16px; border-radius: 50%; background: var(--gc); box-shadow: 0 0 0 4px color-mix(in srgb, var(--gc) 20%, transparent); }
@media (prefers-reduced-motion: no-preference) {
	.bbp-body > ul:hover .fb-forum__dot { animation: fb-pulse 1.2s ease-in-out infinite; }
}
@keyframes fb-pulse { 50% { box-shadow: 0 0 0 9px color-mix(in srgb, var(--gc) 0%, transparent); } }
.bbp-forum-title, .bbp-topic-permalink {
	font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(28px, 3.2vw, 40px); line-height: .95;
}
.bbp-forum-title::after, .bbp-topic-permalink::after { content: ""; position: absolute; inset: 0; } /* toute la ligne est cliquable */
.bbp-forum-content { grid-column: 2; color: var(--muted); font-size: 16px; line-height: 1.45; }
.bbp-forum-content p { margin: 0; }

.bbp-forum-topic-count, .bbp-forum-reply-count, .bbp-topic-voice-count, .bbp-topic-reply-count {
	font-family: var(--font-display); font-weight: 800; font-size: 34px; line-height: 1; text-align: center; font-variant-numeric: tabular-nums;
}
.bbp-forum-topic-count::after, .bbp-forum-reply-count::after, .bbp-topic-voice-count::after, .bbp-topic-reply-count::after {
	display: block; margin-top: 4px; font-family: var(--font-mono); font-stretch: var(--label-stretch); font-weight: 400; font-size: 10.5px; letter-spacing: .005em; text-transform: lowercase; color: var(--muted);
}
.bbp-forum-topic-count::after { content: "sujets"; }
.bbp-forum-reply-count::after, .bbp-topic-reply-count::after { content: "messages"; }
.bbp-topic-voice-count::after { content: "voix"; }

.bbp-forum-freshness, .bbp-topic-freshness { position: relative; z-index: 1; font-size: 14px; color: var(--muted); }
.bbp-forum-freshness > a, .bbp-topic-freshness > a { font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12px; text-transform: lowercase; letter-spacing: .005em; color: var(--muted) !important; }
.bbp-topic-meta { margin: 4px 0 0; font-size: 14px; color: var(--muted); }
.bbp-topic-meta a { position: relative; z-index: 1; }
.bbp-topic-title { min-width: 0; }
.bbp-topic-title .bbp-topic-meta { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.bbp-topic-started-by, .bbp-topic-started-in { font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12px; text-transform: lowercase; letter-spacing: .005em; }
.bbp-author-link { display: inline-flex; align-items: center; gap: 8px; }
.bbp-author-avatar:empty { display: none; }
.bbp-author-avatar img { border-radius: 50%; }
.bbp-forums .sticky, .bbp-topics .sticky, .bbp-topics .super-sticky { background: color-mix(in srgb, var(--accent) 6%, transparent); }

/* Messages d'une discussion --------------------------------------------- */
.bbp-replies { display: grid; gap: 18px; }
.bbp-replies .bbp-body { display: grid; gap: 18px; }
.bbp-reply-header { padding: 0 4px; }
.bbp-reply-header .bbp-meta { display: flex; justify-content: space-between; gap: 12px; font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12px; text-transform: lowercase; letter-spacing: .005em; color: var(--muted); }
.bbp-reply-header .bbp-meta a { color: var(--muted); }
.bbp-admin-links { display: inline-flex; gap: 10px; flex-wrap: wrap; }
.bbp-admin-links a { color: var(--accent) !important; }
.bbp-replies .bbp-body > div:not(.bbp-reply-header) {
	display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: clamp(16px, 3vw, 32px);
	background: var(--paper); border-radius: 12px; padding: clamp(18px, 3vw, 28px);
	border-left: 4px solid var(--line); transition: border-color .3s ease, transform .4s var(--ease);
}
.bbp-replies .bbp-body > div:not(.bbp-reply-header):hover { border-left-color: var(--accent); }
.bbp-replies .bbp-body > div.topic { border-left-color: var(--accent); }
.bbp-reply-author { display: grid; justify-items: start; gap: 6px; align-content: start; }
.bbp-reply-author .bbp-author-link { flex-direction: column; align-items: flex-start; }
.bbp-reply-author .bbp-author-name {
	font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 24px; line-height: 1;
}
.bbp-reply-author .bbp-author-name::before {
	content: ""; /* petit vinyle à la place de l'avatar */
	display: block; width: 44px; height: 44px; margin-bottom: 8px; border-radius: 50%;
	background: radial-gradient(circle, var(--accent) 0 30%, #141216 31%), #141216;
	box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .12);
}
.bbp-author-role { font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 11px; text-transform: lowercase; letter-spacing: .005em; color: var(--accent); }
.bbp-author-ip { font-size: 11px; color: var(--muted); }
.bbp-reply-content { min-width: 0; font-size: 18px; line-height: 1.6; }
.bbp-reply-content > *:first-child { margin-top: 0; }
.bbp-reply-content > *:last-child { margin-bottom: 0; }
.bbp-reply-content a { color: var(--accent) !important; text-decoration: underline !important; }
.bbp-reply-content blockquote { margin: 1em 0; padding-left: 1em; border-left: 3px solid var(--accent); font-style: italic; }

/* Avis, pagination ------------------------------------------------------ */
.bbp-template-notice {
	margin: 0 0 20px; padding: 14px 18px; border-radius: 10px; border-left: 4px solid var(--accent);
	background: color-mix(in srgb, var(--accent) 8%, var(--bg)); font-size: 15px;
}
.bbp-template-notice li { margin: 0; }
.bbp-template-notice.info { background: var(--paper); border-left-color: var(--line); color: var(--muted); }
.bbp-template-notice.error { border-left-color: #B3202A; }
.bbp-pagination { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 16px 0; font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12px; text-transform: lowercase; letter-spacing: .005em; color: var(--muted); }
.bbp-pagination-links { display: flex; gap: 6px; }
.bbp-pagination-links .page-numbers { padding: 6px 12px; border-radius: 999px; }
.bbp-pagination-links .current { background: var(--ink); color: var(--bg); }

/* Formulaires (nouvelle discussion, réponse, connexion) ------------------ */
.bbp-form, #bbpress-forums fieldset.bbp-form {
	border: 0; margin: 28px 0 0; padding: clamp(18px, 4vw, 32px); border-radius: 12px; background: var(--paper); display: grid; gap: 14px;
}
#bbpress-forums fieldset.bbp-form fieldset.bbp-form { padding: 0; margin: 0; background: none; }
#bbpress-forums legend {
	float: left; width: 100%; margin-bottom: 8px; padding: 0;
	font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(28px, 3vw, 36px); line-height: 1;
}
#bbpress-forums label { display: block; font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12px; text-transform: lowercase; letter-spacing: .005em; color: var(--muted); margin-bottom: 6px; }
#bbpress-forums input[type="checkbox"] + label, .bbp-remember-me label { display: inline; text-transform: none; letter-spacing: 0; font-family: var(--font-body); font-size: 15px; }
#bbpress-forums input[type="checkbox"] { accent-color: var(--accent); width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; }
.bbp-submit-wrapper { display: flex; justify-content: flex-end; }
.bbp-login-form { display: grid; gap: 12px; }
.bbp-the-content-wrapper { margin: 0; }
#bbpress-forums .quicktags-toolbar { background: var(--bg); border: 1px solid var(--line); border-bottom: 0; border-radius: 8px 8px 0 0; padding: 6px; }
#bbpress-forums .quicktags-toolbar input { background: var(--paper); border: 1px solid var(--line); border-radius: 6px; padding: 4px 10px; font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12px; color: var(--ink); cursor: pointer; }
#bbpress-forums .quicktags-toolbar + textarea { border-radius: 0 0 8px 8px; }
.bbp-no-reply, .bbp-no-topic { margin-top: 28px; }

/* Profils de membres ----------------------------------------------------- */
#bbp-user-wrapper { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 1fr); gap: clamp(20px, 4vw, 48px); }
#bbp-single-user-details { display: grid; gap: 16px; align-content: start; }
#bbp-user-avatar img { border-radius: 50%; }
#bbp-user-navigation li a {
	display: block; padding: 10px 0; border-bottom: 1px solid var(--line);
	font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 13px; text-transform: lowercase; letter-spacing: .005em;
}
#bbp-user-navigation li.current a { color: var(--accent); }
#bbp-user-body h2.entry-title { font-size: clamp(32px, 4vw, 44px); margin: 0 0 16px; }
.bbp-user-section p { margin: 6px 0; }

/* Mobile ------------------------------------------------------------------ */
@media (max-width: 800px) {
	#bbpress-forums .bbp-forums .bbp-body > ul, #bbpress-forums .bbp-topics .bbp-body > ul { grid-template-columns: repeat(2, auto) minmax(0, 1fr); padding-inline: 4px; }
	.bbp-forum-info, .bbp-topic-title { grid-column: 1 / -1; }
	.bbp-forum-topic-count, .bbp-forum-reply-count, .bbp-topic-voice-count, .bbp-topic-reply-count { font-size: 24px; text-align: left; }
	.bbp-forum-freshness, .bbp-topic-freshness { text-align: right; }
	.bbp-replies .bbp-body > div:not(.bbp-reply-header) { grid-template-columns: minmax(0, 1fr); }
	.bbp-reply-author .bbp-author-link { flex-direction: row; align-items: center; }
	.bbp-reply-author .bbp-author-name::before { width: 32px; height: 32px; margin: 0; }
	#bbp-user-wrapper { grid-template-columns: minmax(0, 1fr); }
}

/* Entrer dans le Salon : créer un compte / se connecter. */
.fb-salon-access { margin: 18px 0 0; }
.fb-salon-access__btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.fb-salon-access__lead { margin: 0 0 10px; color: var(--muted); }
.fb-salon-access--form { background: var(--paper); border-radius: 10px; padding: clamp(18px, 4vw, 28px); margin-top: 18px; }
.fb-salon-access--in { font-family: var(--font-mono); font-stretch: var(--label-stretch); font-size: 12.5px; text-transform: lowercase; color: var(--muted); }
.fb-salon-access--in a { color: var(--accent); }
.fb-btn--ghost { background: transparent !important; color: var(--ink) !important; box-shadow: inset 0 0 0 1.5px var(--line); }
.fb-btn--ghost:hover { box-shadow: inset 0 0 0 1.5px var(--accent); }
