/**
 * Discussions page styling — scoped to .tri-sp-discussions page root.
 * Overrides bbPress vendor styling to match TRI dark/gold design.
 */

.tri-sp-discussions {
	color: var(--tri-sp-text);
	background: transparent;
}

.tri-sp-discussions__header {
	margin: 0 0 32px;
}

.tri-sp-discussions__header h1 {
	font-family: var(--tri-sp-font-heading);
	font-size: 32px;
	font-weight: 700;
	color: var(--tri-sp-text);
	margin: 0 0 12px;
}

.tri-sp-discussions__subtitle {
	font-size: 14px;
	color: var(--tri-sp-text-muted);
	margin: 0;
	line-height: 1.6;
}

.tri-sp-discussions__search-form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0 0 20px;
}

.tri-sp-discussions__search-form input[type="search"] {
	flex: 1 1 260px;
	max-width: 360px;
	background: var(--tri-sp-bg);
	border: 1px solid var(--tri-sp-border);
	border-radius: 4px;
	color: var(--tri-sp-text);
	padding: 10px 12px;
	font-family: var(--tri-sp-font-body);
	font-size: 14px;
}

/* Same Elementor Global Kit `input[type="search"]` specificity collision
   already fixed on My Notes/Institute Library (see tri-sp-my-notes.css) —
   re-declared here via the real ancestor classes already present. */
.tri-sp-discussions .tri-sp-discussions__search-form input[type="search"] {
	background: var(--tri-sp-bg);
	padding: 10px 12px;
	font-size: 14px;
	line-height: normal;
}

.tri-sp-discussions__search-form input[type="search"]:focus {
	border-color: var(--tri-sp-gold);
	outline: none;
}

.tri-sp-discussions__search-results-title {
	font-size: 18px;
	font-weight: 600;
	color: var(--tri-sp-text);
	margin: 0 0 16px;
}

.tri-sp-discussions__search-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tri-sp-discussions__search-item {
	background: rgba(0, 0, 0, 0.2);
	border: 1px solid var(--tri-sp-border);
	border-radius: 4px;
	padding: 16px;
}

.tri-sp-discussions__search-item:hover {
	background: rgba(202, 150, 79, 0.08);
	border-color: var(--tri-sp-border-hover);
}

.tri-sp-discussions__search-item-title {
	color: var(--tri-sp-gold);
	font-weight: 600;
	text-decoration: none;
}

.tri-sp-discussions__search-item-title:hover {
	color: var(--tri-sp-gold-strong);
	text-decoration: underline;
}

.tri-sp-discussions__search-item-type {
	margin-left: 8px;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--tri-sp-text-muted);
}

.tri-sp-discussions__search-item-excerpt {
	margin: 8px 0 0;
	font-size: 13px;
	color: var(--tri-sp-text-muted);
	line-height: 1.6;
}

.tri-sp-discussions__notice {
	background: rgba(202, 150, 79, 0.1);
	border-left: 3px solid var(--tri-sp-gold);
	padding: 16px;
	margin: 0 0 24px;
	font-size: 13px;
	color: var(--tri-sp-text-muted);
	border-radius: 2px;
}

.tri-sp-discussions__notice strong {
	color: var(--tri-sp-text);
	font-weight: 600;
}

.tri-sp-discussions__forums {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.tri-sp-discussions__forum-card {
	background: transparent;
	border: 1px solid var(--tri-sp-border);
	border-radius: 4px;
	padding: 20px;
}

.tri-sp-discussions__forum-title {
	font-size: 16px;
	font-weight: 600;
	color: var(--tri-sp-gold);
	margin: 0 0 8px;
}

.tri-sp-discussions__forum-description {
	font-size: 13px;
	color: var(--tri-sp-text-muted);
	margin: 0 0 16px;
}

.tri-sp-discussions__forum-content {
	margin-top: 16px;
}

.tri-sp-discussions__empty {
	text-align: center;
	padding: 48px 20px;
	color: var(--tri-sp-text-muted);
}

/* Override bbPress default styling */
.tri-sp-discussions #bbpress-forums,
.tri-sp-discussions .bbpress,
.tri-sp-discussions .bbp-body,
.tri-sp-discussions .bbp-forum-content {
	background: transparent !important;
	color: var(--tri-sp-text) !important;
}

/* Forum list items */
.tri-sp-discussions .bbp-forum-list .bbp-forum,
.tri-sp-discussions .bbp-topic-list .bbp-topic {
	background: rgba(0, 0, 0, 0.2) !important;
	border: 1px solid var(--tri-sp-border) !important;
	border-radius: 4px !important;
	padding: 16px !important;
	margin-bottom: 12px !important;
}

.tri-sp-discussions .bbp-forum-list .bbp-forum:hover,
.tri-sp-discussions .bbp-topic-list .bbp-topic:hover {
	background: rgba(202, 150, 79, 0.08) !important;
	border-color: var(--tri-sp-border-hover) !important;
}

.tri-sp-discussions .bbp-forum-title,
.tri-sp-discussions .bbp-topic-title {
	color: var(--tri-sp-text);
	font-family: var(--tri-sp-font-body);
}

.tri-sp-discussions .bbp-forum-title a,
.tri-sp-discussions .bbp-topic-title a {
	color: var(--tri-sp-gold);
	text-decoration: none;
}

.tri-sp-discussions .bbp-forum-title a:hover,
.tri-sp-discussions .bbp-topic-title a:hover {
	color: var(--tri-sp-gold-strong);
	text-decoration: underline;
}

.tri-sp-discussions .bbp-pagination {
	text-align: center;
	margin: 16px 0;
}

.tri-sp-discussions .bbp-pagination a,
.tri-sp-discussions .bbp-pagination span {
	display: inline-block;
	padding: 6px 10px;
	margin: 0 2px;
	background: transparent;
	border: 1px solid var(--tri-sp-border);
	color: var(--tri-sp-text-muted);
	text-decoration: none;
	font-size: 12px;
}

.tri-sp-discussions .bbp-pagination a:hover {
	background: rgba(202, 150, 79, 0.1);
	border-color: var(--tri-sp-gold);
	color: var(--tri-sp-gold);
}

.tri-sp-discussions .bbp-pagination .current {
	background: var(--tri-sp-gold);
	border-color: var(--tri-sp-gold);
	color: #1a1206;
}

/* Topic header styling */
.tri-sp-discussions .bbp-topic-header,
.tri-sp-discussions .bbp-forum-header {
	background: rgba(0, 0, 0, 0.2) !important;
	border: 1px solid var(--tri-sp-border) !important;
	border-radius: 4px !important;
	padding: 16px !important;
	margin-bottom: 16px !important;
}

/* Single topic/forum */
.tri-sp-discussions #bbpress-forums .bbp-single-topic,
.tri-sp-discussions #bbpress-forums .bbp-single-forum {
	background: transparent !important;
}

/* Topic/forum title bar */
.tri-sp-discussions .bbp-topic-title-bar,
.tri-sp-discussions .bbp-forum-title-bar {
	background: rgba(0, 0, 0, 0.2) !important;
	border: 1px solid var(--tri-sp-border) !important;
	border-radius: 4px !important;
	padding: 12px 16px !important;
	margin-bottom: 12px !important;
}

/* Individual reply */
.tri-sp-discussions .bbp-reply,
.tri-sp-discussions .bbp-topic-item {
	background: rgba(0, 0, 0, 0.2) !important;
	border: 1px solid var(--tri-sp-border) !important;
	border-radius: 4px !important;
	padding: 16px !important;
	margin-bottom: 12px !important;
}

.tri-sp-discussions .bbp-reply:hover,
.tri-sp-discussions .bbp-topic-item:hover {
	background: rgba(202, 150, 79, 0.08) !important;
	border-color: var(--tri-sp-border-hover) !important;
}

.tri-sp-discussions .bbp-reply-author,
.tri-sp-discussions .bbp-author-name {
	font-size: 12px;
	color: var(--tri-sp-text-muted);
	margin-bottom: 8px;
	font-weight: 600;
}

.tri-sp-discussions .bbp-reply-content,
.tri-sp-discussions .bbp-post-content {
	font-size: 14px;
	line-height: 1.6;
	color: var(--tri-sp-text);
}

/* Reply form container */
.tri-sp-discussions #bbpress-forums .bbp-reply-form,
.tri-sp-discussions #bbpress-forums .bbp-topic-form,
.tri-sp-discussions .bbp-form {
	background: var(--tri-sp-card-bg) !important;
	border: 1px solid var(--tri-sp-border) !important;
	border-radius: 4px !important;
	padding: 20px !important;
	margin-top: 20px !important;
}

/* Form styling.
 *
 * Backgrounds are `transparent` so the field takes on whatever card it sits
 * in, rather than painting its own panel — and, importantly, so no field can
 * inherit Elementor's Global Kit accent background
 * (`.elementor-kit-47604 input:not(…), … textarea`), which is what made these
 * fields render solid gold on native bbPress URLs.
 *
 * The `#bbpress-forums` ID keeps these at (1,2,1), far above the kit rule's
 * (0,3,1) — the real fix was making sure this stylesheet is actually enqueued
 * on bbPress pages at all (see LearnDash\BBPressIntegration::maybe_enqueue()).
 *
 * `search`, `password`, `number` and `select` are included because bbPress and
 * its add-ons use them in the topic/reply and search forms; leaving any type
 * out is precisely how the accent background reappears. */
.tri-sp-discussions #bbpress-forums textarea,
.tri-sp-discussions #bbpress-forums input[type="text"],
.tri-sp-discussions #bbpress-forums input[type="email"],
.tri-sp-discussions #bbpress-forums input[type="url"],
.tri-sp-discussions #bbpress-forums input[type="search"],
.tri-sp-discussions #bbpress-forums input[type="password"],
.tri-sp-discussions #bbpress-forums input[type="number"],
.tri-sp-discussions #bbpress-forums input:not([type]),
.tri-sp-discussions #bbpress-forums select {
	background: transparent;
	border: 1px solid var(--tri-sp-border);
	color: var(--tri-sp-text);
	font-family: var(--tri-sp-font-body);
	padding: 10px 12px;
	font-size: 14px;
	border-radius: 2px;
}

/* The TinyMCE/Quicktags editor bbPress renders for the reply body wraps the
   textarea in its own chrome, which would otherwise show the kit's accent
   colour around a now-transparent field. */
.tri-sp-discussions #bbpress-forums .wp-editor-container,
.tri-sp-discussions #bbpress-forums .wp-editor-area,
.tri-sp-discussions #bbpress-forums .quicktags-toolbar {
	background: transparent;
	border-color: var(--tri-sp-border);
}

.tri-sp-discussions #bbpress-forums textarea:focus,
.tri-sp-discussions #bbpress-forums input[type="text"]:focus,
.tri-sp-discussions #bbpress-forums input[type="email"]:focus,
.tri-sp-discussions #bbpress-forums input[type="url"]:focus {
	border-color: var(--tri-sp-gold);
	outline: none;
}

.tri-sp-discussions #bbpress-forums button,
.tri-sp-discussions #bbpress-forums input[type="button"],
.tri-sp-discussions #bbpress-forums input[type="submit"] {
	background: var(--tri-sp-gold);
	border: 1px solid var(--tri-sp-gold);
	color: #1a1206;
	padding: 10px 20px;
	font-family: var(--tri-sp-font-body);
	font-weight: 600;
	cursor: pointer;
	border-radius: 2px;
	font-size: 14px;
}

.tri-sp-discussions #bbpress-forums button:hover,
.tri-sp-discussions #bbpress-forums input[type="button"]:hover,
.tri-sp-discussions #bbpress-forums input[type="submit"]:hover {
	background: var(--tri-sp-gold-strong);
	border-color: var(--tri-sp-gold-strong);
}

/* Responsive */
@media (max-width: 768px) {
	.tri-sp-discussions__header h1 {
		font-size: 24px;
	}

	.tri-sp-discussions__forum-card {
		padding: 16px;
	}

	.tri-sp-discussions__forums {
		gap: 16px;
	}
}

@media (max-width: 390px) {
	.tri-sp-discussions__notice {
		padding: 12px;
		font-size: 12px;
	}

	.tri-sp-discussions__forum-card {
		padding: 12px;
	}
}
