/* ==========================================================================
   Oddsfactory — wpForo Theme Bridge
   Restyles every wpForo ("classic" theme) element to match the site's
   Dark Navy + Emerald design system. Loaded after wpForo's own style.css,
   widgets.css and dynamically generated colors.css so it wins the cascade
   without needing to touch plugin files or admin-stored custom CSS.
   ========================================================================== */

#wpforo,
#wpforo #wpforo-wrap,
.wpforo-widget-wrap {
	font-family: var(--of-font);
}

#wpforo #wpforo-wrap {
	background: var(--of-bg-primary);
	color: var(--of-text-secondary);
}

#wpforo #wpforo-wrap a,
#wpforo #wpforo-wrap a:visited,
#wpforo #wpforo-wrap .wpflink,
.wpf-link {
	color: var(--of-text-primary);
}

#wpforo #wpforo-wrap a:hover,
#wpforo #wpforo-wrap a:active,
#wpforo #wpforo-wrap .wpflink:hover {
	color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap h1,
#wpforo #wpforo-wrap h2,
#wpforo #wpforo-wrap h3,
#wpforo #wpforo-wrap h4,
#wpforo #wpforo-wrap h5,
#wpforo #wpforo-wrap h6 {
	color: var(--of-text-primary);
	font-family: var(--of-font);
}

#wpforo #wpforo-title {
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap hr {
	border: none !important;
	border-top: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-description {
	color: var(--of-text-muted) !important;
	border-bottom: 1px solid var(--of-border) !important;
}

/* --------------------------------------------------------------------------
   Top Bar: menu, search, notifications, mobile toggle
   -------------------------------------------------------------------------- */
#wpforo #wpforo-menu {
	background: var(--of-bg-secondary) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius-lg) !important;
}

#wpforo #wpforo-wrap #wpforo-menu {
	background-color: var(--of-bg-secondary) !important;
}

#wpforo #wpforo-wrap #wpforo-menu li {
	border-right: none !important;
}

#wpforo ul.wpf-menu > li > a,
#wpforo #wpforo-wrap #wpforo-menu li a {
	color: var(--of-text-secondary) !important;
}

#wpforo ul.wpf-menu > li > a:hover {
	color: var(--of-text-primary) !important;
	background: rgba(255, 255, 255, 0.05) !important;
}

#wpforo ul.wpf-menu > .current-menu-item > a,
#wpforo ul.wpf-menu > .wpforo-active > a,
#wpforo #wpforo-wrap .wpforo-active,
#wpforo #wpforo-wrap #wpforo-menu li:hover,
#wpforo #wpforo-wrap #wpforo-menu .current-menu-ancestor,
#wpforo #wpforo-wrap #wpforo-menu .current-menu-parent,
#wpforo #wpforo-wrap #wpforo-menu .current_page_item {
	color: var(--of-bg-primary) !important;
	background-color: var(--of-accent) !important;
	border-bottom-color: var(--of-accent) !important;
	font-weight: 600;
}

/* The rules above set `color` on the <li> itself (and, for the active state,
   on the <a> via a selector that only has 1 ID — "#wpforo ul.wpf-menu >
   .wpforo-active > a"). Both lose to the base link-color rule further up
   ("#wpforo #wpforo-wrap #wpforo-menu li a", 3 IDs), since a declaration on
   an ancestor/lower-specificity selector never overrides one declared
   directly on the same element by a higher-specificity rule. Net effect: the
   green hover/active pill painted the right background but left the muted
   grey link text on top of it, unreadable against bright green — for BOTH
   the persistent "current page" pill and the transient hover pill.
   Re-target the <a> explicitly, matching the winning selector's ID count, so
   it always gets the dark text in every one of these states. */
#wpforo #wpforo-wrap #wpforo-menu li:hover > a,
#wpforo #wpforo-wrap #wpforo-menu .wpforo-active > a,
#wpforo #wpforo-wrap #wpforo-menu .current-menu-item > a,
#wpforo #wpforo-wrap #wpforo-menu .current-menu-ancestor > a,
#wpforo #wpforo-wrap #wpforo-menu .current-menu-parent > a,
#wpforo #wpforo-wrap #wpforo-menu .current_page_item > a {
	color: var(--of-bg-primary) !important;
}

#wpforo #wpforo-wrap #wpforo-menu .wpf-menu > li {
	position: relative !important;
}

/* #wpforo-menu is rounded (border-radius: var(--of-radius-lg)) but the top
   level <li>s that paint the hover/active green pill have square corners of
   their own, and the first item's box sits flush against the container's
   left edge — so its hover background visibly squares off past the
   container's rounded corner instead of following it. Round that outer edge
   to match (inner edge stays square since the next item butts up against
   it). Do the same for the last item's right edge for symmetry, in case the
   search box is ever disabled and it becomes the flush right edge too. */
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu > li:first-child,
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu > li:first-child > a {
	border-radius: var(--of-radius-lg) 0 0 var(--of-radius-lg) !important;
}

#wpforo #wpforo-wrap #wpforo-menu .wpf-menu > li:last-child,
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu > li:last-child > a {
	border-radius: 0 var(--of-radius-lg) var(--of-radius-lg) 0 !important;
}

/* wpForo ships two competing menu-link rulesets: the classic theme's
   padding-based one (padding:15px 24px, no explicit height) and its own
   dynamically generated colors.css "modern menu" one (display:flex but
   height:64px, padding:0 16px). Depending on which selector wins per
   property, the link can end up with a tall fixed height box but only
   padding/line-height driving the text position — leaving unclaimed space
   that isn't actually centered, so the label sits nearer the top. Forcing
   flex centering here is immune to that tug-of-war regardless of which
   height/padding declaration ends up "winning". */
#wpforo #wpforo-wrap #wpforo-menu .wpf-menu > li > a {
	display: flex !important;
	align-items: center !important;
}

/* Explicit position/size for the dropdown: wpForo's own rule for
   "#wpforo-menu li > ul" has no top/left/width, which leaves the browser
   to guess a "hypothetical static position" — reliable in simple cases but
   easily thrown off by the surrounding flex/table-cell layout, causing the
   dropdown (and its items) to render shifted or to wrap awkwardly. */
#wpforo ul.sub-menu,
#wpforo #wpforo-wrap #wpforo-menu li > ul {
	background: var(--of-bg-card) !important;
	border: 1px solid var(--of-border) !important;
	box-shadow: var(--of-shadow) !important;
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	right: auto !important;
	margin-top: 4px !important;
	min-width: 180px !important;
	padding: 6px 0 !important;
	border-radius: var(--of-radius) !important;
}

#wpforo ul.sub-menu li,
#wpforo #wpforo-wrap #wpforo-menu li > ul > li {
	width: 100% !important;
}

#wpforo ul.sub-menu li a,
#wpforo #wpforo-wrap #wpforo-menu li > ul a {
	color: var(--of-text-secondary) !important;
	display: flex !important;
	align-items: center !important;
	padding: 10px 18px !important;
	line-height: 1.4 !important;
	white-space: nowrap !important;
}

#wpforo ul.sub-menu li a:hover,
#wpforo #wpforo-wrap #wpforo-menu li > ul a:hover {
	background: rgba(255, 255, 255, 0.05) !important;
	color: var(--of-text-primary) !important;
}

/* Keep the loud "current page" accent highlight for top-level items only —
   without this it would also bleed onto dropdown items on hover, since that
   rule's selector specificity beats the more targeted one above. */
#wpforo #wpforo-wrap #wpforo-menu li > ul li:hover {
	color: var(--of-text-primary) !important;
	background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Collapsed state must stay transparent (no fill, no border) — the input
   has a higher z-index than the icon (wpForo's own rule), so any opaque
   background here would sit on top of and completely hide the icon. */
#wpforo .wpf-search input,
#wpforo #wpforo-wrap .wpf-search input[type="text"] {
	background: transparent !important;
	border: none !important;
	color: var(--of-text-primary) !important;
}

#wpforo .wpf-search input:focus,
#wpforo #wpforo-wrap .wpf-search input[type="text"]:focus {
	border: 1px solid var(--of-accent) !important;
	border-radius: var(--of-radius) !important;
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.15) !important;
	background: var(--of-bg-card) !important;
}

#wpforo #wpforo-wrap .wpf-search {
	position: relative !important;
}

#wpforo #wpforo-wrap .wpf-search i {
	color: var(--of-text-muted) !important;
	top: 50% !important;
	margin: 0 !important;
	transform: translateY(-50%) !important;
	line-height: 1 !important;
	pointer-events: none !important;
}

#wpforo .wpf-bell,
#wpforo .wpf-res-menu {
	color: var(--of-text-secondary) !important;
}

#wpforo .wpf-bell:hover,
#wpforo .wpf-res-menu:hover {
	background: rgba(255, 255, 255, 0.06) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-bar-right .wpf-alerts {
	color: var(--of-text-muted) !important;
	border-right: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpf-bar-right .wpf-alerts i {
	color: var(--of-text-muted) !important;
	text-shadow: none !important;
}

#wpforo #wpforo-wrap .wpf-bar-right .wpf-alerts i:hover {
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-bar-right .wpf-alerts.wpf-new i,
#wpforo #wpforo-wrap .wpf-bar-right .wpf-alerts-count {
	color: var(--of-odds-mid) !important;
	text-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Notifications dropdown
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpf-notifications,
#wpf-widget-profile .wpf-notifications {
	background: var(--of-bg-card) !important;
	border: 1px solid var(--of-border) !important;
	border-top: none !important;
	box-shadow: var(--of-shadow) !important;
}

#wpforo #wpforo-wrap .wpf-notifications .wpf-notification-head,
#wpf-widget-profile .wpf-notifications .wpf-notification-head {
	color: var(--of-text-primary) !important;
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpf-notifications .wpf-notification-content,
#wpf-widget-profile .wpf-notifications .wpf-notification-content {
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .wpf-notifications .wpf-notification-content li,
#wpf-widget-profile .wpf-notifications .wpf-notification-content li {
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpf-notifications .wpf-notification-content li:hover,
#wpf-widget-profile .wpf-notifications .wpf-notification-content li:hover {
	background: rgba(255, 255, 255, 0.04) !important;
}

#wpforo #wpforo-wrap .wpf-notifications .wpf-notification-content .wpf-ndesc,
#wpf-widget-profile .wpf-notifications .wpf-notification-content .wpf-ndesc {
	color: var(--of-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Breadcrumb
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpf-breadcrumb a {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpf-breadcrumb div:hover,
#wpforo #wpforo-wrap .wpf-breadcrumb div:hover:after,
#wpforo #wpforo-wrap .wpf-breadcrumb div.active,
#wpforo #wpforo-wrap .wpf-breadcrumb div.active:after {
	background: var(--of-bg-card) !important;
	color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpf-breadcrumb div:after {
	background: var(--of-bg-primary) !important;
}

#wpforo #wpforo-wrap .wpf-breadcrumb .wpf-root {
	border-left: 1px solid var(--of-border) !important;
}

/* --------------------------------------------------------------------------
   Category / Forum / Topic list headers
   Full-bleed brand-colour bars are replaced with the site's card language:
   dark surface + accent left border, rather than a solid green block.
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpfl-1 .wpforo-category,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-category,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-category,
#wpforo #wpforo-wrap .wpfl-4 .wpforo-category,
#wpforo #wpforo-wrap .wpfl-1 .wpforo-topic-head,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-topic-head,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-topic-head,
#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-head,
#wpforo #wpforo-wrap .wpft-topic .wpfl-4 .wpf-threads-head,
#wpforo #wpforo-wrap .wpfl-1 .wpforo-post-head,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-post-head,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post-head,
#wpforo #wpforo-wrap .wpfl-4 .wpforo-post-head {
	background-color: var(--of-bg-secondary) !important;
	border-bottom: 1px solid var(--of-border) !important;
	border-left: 3px solid var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpfl-1 .cat-title,
#wpforo #wpforo-wrap .wpfl-1 .cat-stat-posts,
#wpforo #wpforo-wrap .wpfl-1 .cat-stat-topics,
#wpforo #wpforo-wrap .wpfl-2 .cat-title,
#wpforo #wpforo-wrap .wpfl-2 .cat-lastpostinfo,
#wpforo #wpforo-wrap .wpfl-3 .cat-title,
#wpforo #wpforo-wrap .wpfl-3 .cat-stat-posts,
#wpforo #wpforo-wrap .wpfl-3 .cat-stat-answers,
#wpforo #wpforo-wrap .wpfl-3 .cat-stat-questions,
#wpforo #wpforo-wrap .wpfl-4 .cat-title,
#wpforo #wpforo-wrap .wpfl-1 .head-title,
#wpforo #wpforo-wrap .wpfl-1 .head-stat-posts,
#wpforo #wpforo-wrap .wpfl-1 .head-stat-views,
#wpforo #wpforo-wrap .wpfl-2 .head-title,
#wpforo #wpforo-wrap .wpfl-2 .head-stat-posts,
#wpforo #wpforo-wrap .wpfl-2 .head-stat-views,
#wpforo #wpforo-wrap .wpfl-2 .head-stat-lastpost,
#wpforo #wpforo-wrap .wpfl-3 .head-title,
#wpforo #wpforo-wrap .wpfl-3 .head-stat-posts,
#wpforo #wpforo-wrap .wpfl-3 .head-stat-lastpost,
#wpforo #wpforo-wrap .wpft-topic .wpfl-4 .wpf-threads-head .wpf-head-box {
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpfl-1 .wpforo-forum,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-forum,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-forum,
#wpforo #wpforo-wrap .wpfl-1 .wpforo-topic,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-topic,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-topic,
#wpforo #wpforo-wrap .wpft-topic .wpfl-4 .wpf-thread,
#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item {
	background-color: transparent !important;
}

#wpforo #wpforo-wrap .wpfl-1 .forum-wrap,
#wpforo #wpforo-wrap .wpfl-2 .forum-wrap,
#wpforo #wpforo-wrap .wpfl-3 .forum-wrap,
#wpforo #wpforo-wrap .wpfl-1 .topic-wrap,
#wpforo #wpforo-wrap .wpfl-2 .topic-wrap,
#wpforo #wpforo-wrap .wpfl-3 .topic-wrap,
#wpforo #wpforo-wrap .wpfl-1 .wpforo-subforum,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-subforum,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-subforum,
#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item,
#wpforo #wpforo-wrap .wpfl-4 .wpf-head-bar,
#wpforo #wpforo-wrap .wpfl-4 .wpf-threads .wpf-thread,
#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-head {
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpfl-1 .wpforo-forum-description,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-forum-description,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-forum-description,
#wpforo #wpforo-wrap .wpfl-1 .wpforo-forum-footer,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-forum-footer,
#wpforo #wpforo-wrap .wpforo-subforum i {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpfl-1 .wpforo-last-topics,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-last-topics,
#wpforo #wpforo-wrap .wpfl-1 .wpforo-last-posts,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-last-topic-posts,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-last-topic .votes,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-last-topic .answers,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-last-topic .views,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-topic-status .votes,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-topic-status .answers,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-topic .views,
#wpforo #wpforo-wrap .wpfl-4 .wpf-tags {
	background-color: var(--of-bg-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-topic-badges {
	background-color: var(--of-bg-card) !important;
}

/* --------------------------------------------------------------------------
   Layout 4 — Threaded (the layout actually in use on this site).
   wpForo's colors.css scopes a lot of light-mode colors specifically under
   ".wpfl-4", so generic rules above don't reach them — patched individually.
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpfl-4 .wpf-head-bar,
#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item,
#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-head,
#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-label,
#wpforo #wpforo-wrap .wpf-parent-post .wpf-right .wpf-content-head-top,
#wpforo #wpforo-wrap .wpf-content-foot {
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-head .wpf-head-box,
#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-label,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-newest,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-hottest,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-solved,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-unsolved,
#wpforo #wpforo-wrap .wpforo-tags .wpf-tags-text i,
#wpforo #wpforo-wrap .wpforo-tags tag a,
#wpforo #wpforo-wrap .wpforo-topic-meta .wpforo-tags .wpf-tags-title i,
#wpforo #wpforo-wrap .wpf-parent-post .wpf-left .wpf-author-posts,
#wpforo #wpforo-wrap .wpf-reply-head .wpf-author .wpforo-memberinfo,
#wpforo #wpforo-wrap .wpf-post-date,
#wpforo #wpforo-wrap .wpf-content-head-bottom .wpf-author,
#wpforo #wpforo-wrap .wpf-content-foot .wpf-reaction-wrap .wpf-like-count,
#wpforo #wpforo-wrap .wpf-post-replies-bar {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-newest:hover,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-hottest:hover,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-solved:hover,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-unsolved:hover,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-newest.wpf-active,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-hottest.wpf-active,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-solved.wpf-active,
#wpforo #wpforo-wrap .wpfl-4 .wpf-load-threads .wpf-unsolved.wpf-active {
	color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpf-content-foot .wpf-reply .wpf-action {
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
	border-radius: var(--of-radius) !important;
}

#wpforo #wpforo-wrap .wpforo-post .bottom .reacted-users a {
	color: var(--of-odds-mid) !important;
}

#wpforo #wpforo-wrap .wpf-child-post .wpf-reply-head .wpf-author-avatar .avatar {
	border-color: var(--of-border) !important;
}

/* wpForo's generated colors.css has "#wpforo .wpf-left{display:flex !important;
   align-items:center; height:100%;}" intended only for the TOP NAV BAR's
   .wpf-left (search/breadcrumb area, see themes/classic/header.php). But the
   post author sidebar column reuses the exact same ".wpf-left" class name, so
   that unscoped rule also turns it into a flex ROW: the avatar, rating/post
   count, and member-profile-button icons all shrink to min-content and get
   crammed side-by-side instead of stacking, overflowing the ~100px column
   width and rendering underneath/behind .wpf-right. Force it back to normal
   block stacking, scoped to post/comment contexts only so the real nav bar
   .wpf-left is untouched. */
#wpforo #wpforo-wrap .wpforo-post .wpf-left,
#wpforo #wpforo-wrap .wpforo-comment .wpf-left {
	display: block !important;
}

/* On narrower viewports wpForo's own CSS floats the parent post's avatar +
   member-info column (.wpf-left) but forgets to give the content column
   (.wpf-right) a matching margin-left to clear it — .wpf-right is left at
   width:100% starting at the same x position, so the author name, "Topic
   starter" badge, and post meta render directly underneath/behind the
   floated avatar/profile-buttons column instead of beside it. */
@media screen and (max-width: 800px) {
	#wpforo #wpforo-wrap .wpfl-4 .wpf-parent-post .wpf-right {
		width: auto !important;
		margin-left: 110px !important;
	}

	/* With .wpf-left restored to normal block stacking, the member-profile
	   icon row (Profile/Activity/Subscriptions) should sit centered under the
	   avatar and posts count rather than clinging to their right edge. */
	#wpforo #wpforo-wrap .wpfl-4 .wpf-parent-post .wpforo-memberinfo {
		text-align: center !important;
	}
}

/* --------------------------------------------------------------------------
   No results / empty states
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpf-p-error,
#wpforo #wpforo-wrap .wpf-page-message-wrap,
#wpforo #wpforo-wrap .wpf-page-message-text,
#wpforo #wpforo-wrap .wpforo-404-wrap .wpforo-404-content,
#wpforo #wpforo-wrap .wpfl-4 .wpf-thread-list .wpf-no-thread {
	background-color: var(--of-bg-secondary) !important;
	color: var(--of-text-muted) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) !important;
}

/* Generic "no topics/results were found" box rendered without a dedicated class */
#wpforo #wpforo-wrap div[style*="background"][style*="e6e6e6"] {
	background-color: var(--of-bg-secondary) !important;
	color: var(--of-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Forms: inputs, textareas, selects — global
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap input[type="text"],
#wpforo #wpforo-wrap input[type="password"],
#wpforo #wpforo-wrap input[type="email"],
#wpforo #wpforo-wrap input[type="search"],
#wpforo #wpforo-wrap input[type="date"],
#wpforo #wpforo-wrap input[type="number"],
#wpforo #wpforo-wrap input[type="url"],
#wpforo #wpforo-wrap input[type="tel"],
#wpforo #wpforo-wrap textarea,
#wpforo #wpforo-wrap select,
#wpforo-dialog input[type="text"],
#wpforo-dialog textarea,
#wpforo-dialog select {
	background: var(--of-bg-card) !important;
	color: var(--of-text-primary) !important;
	border: 1px solid var(--of-border) !important;
	box-shadow: none !important;
	border-radius: var(--of-radius) !important;
}

#wpforo #wpforo-wrap input[type="text"]:focus,
#wpforo #wpforo-wrap input[type="password"]:focus,
#wpforo #wpforo-wrap input[type="email"]:focus,
#wpforo #wpforo-wrap input[type="search"]:focus,
#wpforo #wpforo-wrap input[type="date"]:focus,
#wpforo #wpforo-wrap input[type="number"]:focus,
#wpforo #wpforo-wrap input[type="url"]:focus,
#wpforo #wpforo-wrap input[type="tel"]:focus,
#wpforo #wpforo-wrap textarea:focus,
#wpforo #wpforo-wrap select:focus {
	border-color: var(--of-accent) !important;
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.12) !important;
}

#wpforo #wpforo-wrap input::placeholder,
#wpforo #wpforo-wrap textarea::placeholder,
#wpforo #wpforo-wrap .wpf-field input::-webkit-input-placeholder,
#wpforo #wpforo-wrap .wpf-field textarea::-webkit-input-placeholder {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap input[type="file"] {
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap input[type="checkbox"],
#wpforo #wpforo-wrap input[type="radio"] {
	accent-color: var(--of-accent);
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap input[type="submit"],
#wpforo #wpforo-wrap input[type="reset"],
#wpforo #wpforo-wrap input[type="button"],
#wpforo-dialog input[type="submit"],
#wpforo-dialog input[type="reset"],
#wpforo-dialog input[type="button"],
#wpforo #wpforo-wrap .wpf-button,
.wpf-button,
.ui-widget input[type="submit"] {
	background: var(--of-accent) !important;
	color: var(--of-bg-primary) !important;
	border: none !important;
	border-radius: var(--of-radius) !important;
	font-weight: 600 !important;
	box-shadow: none !important;
	transition: background-color 0.2s ease;
}

#wpforo #wpforo-wrap input[type="submit"]:hover,
#wpforo #wpforo-wrap input[type="reset"]:hover,
#wpforo #wpforo-wrap input[type="button"]:hover,
#wpforo #wpforo-wrap .wpf-button:hover,
.wpf-button:hover,
.ui-widget input[type="submit"]:hover {
	background: var(--of-accent-hover) !important;
}

#wpforo #wpforo-wrap .wpf-button-secondary,
.wpf-button-secondary,
.wpforo-widget-wrap .wpf-button-secondary {
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) !important;
	opacity: 1 !important;
}

#wpforo #wpforo-wrap .wpf-button-secondary:hover,
.wpf-button-secondary:hover,
.wpforo-widget-wrap .wpf-button-secondary:hover {
	color: var(--of-text-primary) !important;
	border-color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpf-button-outlined {
	color: var(--of-text-primary) !important;
	border: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpf-navi .wpf-navi-wrap .wpf-prev-button,
#wpforo #wpforo-wrap .wpf-navi .wpf-navi-wrap .wpf-next-button {
	background: var(--of-bg-card) !important;
	color: var(--of-text-primary) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) !important;
}

#wpforo #wpforo-wrap .wpf-navi .wpf-navi-wrap .wpf-prev-button:hover,
#wpforo #wpforo-wrap .wpf-navi .wpf-navi-wrap .wpf-next-button:hover {
	background: var(--of-accent) !important;
	color: var(--of-bg-primary) !important;
	border-color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpf-navi .wpf-navi-wrap .wpf-page-info {
	color: var(--of-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Post / Topic content: body, code, blockquote, attachments, signature
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpforo-post,
#wpforo #wpforo-wrap .wpforo-comment {
	background-color: transparent !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpf-right,
#wpforo #wpforo-wrap .wpfl-2 .wpforo-post .wpf-right,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-right,
#wpforo #wpforo-wrap .wpfl-3 .wpforo-comment .wpf-right,
#wpforo #wpforo-wrap .wpf-child-post .wpf-reply-content,
#wpforo #wpforo-wrap .wpf-parent-post .wpf-right .wpf-content {
	background: var(--of-bg-secondary) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpf-right .wpforo-post-content-top,
#wpforo #wpforo-wrap .wpforo-post .wpf-right .wpforo-post-content-bottom,
#wpforo #wpforo-wrap .wpforo-post .wpforo-post-tool-bar,
#wpforo #wpforo-wrap .wpf-parent-post .wpf-right .wpf-content-head-top {
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpf-left .avatar,
#wpforo #wpforo-wrap .wpf-child-post .wpf-reply-head .wpf-author-avatar .avatar,
#wpforo #wpforo-wrap .wpforo-profile-wrap .h-left .avatar,
#wpforo #wpforo-wrap .wpforo-profile-wrap .h-picture .avatar {
	background: var(--of-bg-card) !important;
	border-color: var(--of-border) !important;
	box-shadow: none !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpf-left .author-rating,
#wpforo #wpforo-wrap .author-rating {
	background: var(--of-bg-card) !important;
	border: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-post .bottom,
#wpforo #wpforo-wrap .wpf-child-post .wpf-content-foot,
#wpforo #wpforo-wrap .wpforo-post .wpforo-post-footer {
	border-color: var(--of-border) !important;
	background: transparent !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-post-content img,
#wpforo #wpforo-wrap .wpforo-revision-body img,
#wpforo #wpforo-wrap img.wpforo-auto-embeded-image {
	border: 1px solid var(--of-border) !important;
	background: var(--of-bg-card) !important;
}

#wpforo #wpforo-wrap .wpforo-post blockquote,
#wpforo #wpforo-wrap .wpforo-revision-body blockquote {
	border: none !important;
	border-left: 3px solid var(--of-accent) !important;
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
	border-radius: 0 var(--of-radius) var(--of-radius) 0 !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-post-code,
#wpforo #wpforo-wrap .wpforo-revision-body .wpforo-post-code,
#wpforo #wpforo-wrap .wpforo-post code,
#wpforo #wpforo-wrap .wpforo-revision-body code,
#wpforo #wpforo-wrap pre {
	border: 1px solid var(--of-border) !important;
	background: var(--of-bg-card) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-post-code-title {
	border-bottom: 1px solid var(--of-border) !important;
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-post-attachments {
	border: 1px dotted var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-post-attachments img {
	border: 2px solid var(--of-border) !important;
	background: var(--of-bg-card) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-attached-file {
	border: 1px dotted var(--of-border) !important;
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-post-signature {
	border-top: 1px dotted var(--of-accent) !important;
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpforo-post .wpforo-membertoggle i {
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .wpf-mod-message {
	color: var(--of-odds-mid) !important;
}

#wpforo #wpforo-wrap .wpf-post-starter {
	background: var(--of-bg-card) !important;
	border: 1px solid var(--of-border) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-author-nicename {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpforo-admin-note {
	border: 1px solid var(--of-border) !important;
	background: var(--of-bg-card) !important;
}

#wpforo #wpforo-wrap .wpf-member-title.wpfut {
	border: 1px solid var(--of-border) !important;
	color: var(--of-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Editor chrome: quicktags toolbar + TinyMCE UI
   (The editable canvas itself is themed via JS — see wpforo-editor-theme.js)
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpf-topic-create,
#wpforo #wpforo-wrap .wpf-post-create,
#wpforo #wpforo-wrap .wpforo-portable-form-wrap {
	background-color: var(--of-bg-secondary) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) !important;
}

#wpforo #wpforo-wrap .wpf-topic-create .wp-editor-tools,
#wpforo #wpforo-wrap .wpf-post-create .wp-editor-tools {
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wp-editor-tabs a.switch-tmce,
#wpforo #wpforo-wrap .wp-editor-tabs a.switch-html {
	border: 1px solid var(--of-border) !important;
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .quicktags-toolbar input[type="button"] {
	background: var(--of-bg-card) !important;
	color: var(--of-text-primary) !important;
	border: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .quicktags-toolbar input[type="button"]:hover {
	background: var(--of-accent) !important;
	color: var(--of-bg-primary) !important;
}

/* TinyMCE chrome (toolbar / menu bar / status bar live outside the iframe) */
#wpforo #wpforo-wrap .mce-tinymce,
#wpforo #wpforo-wrap .mce-panel {
	background: var(--of-bg-secondary) !important;
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap .mce-toolbar-grp,
#wpforo #wpforo-wrap .mce-menubar,
#wpforo #wpforo-wrap .mce-statusbar {
	background: var(--of-bg-secondary) !important;
	border-color: var(--of-border) !important;
}

/* TinyMCE only gives the edit area a 1px top border by default (inline
   style, border-width: 1px 0 0), which barely reads against a dark page —
   give the actual editable region its own clearly visible border on all
   sides so it's obvious where you can type. */
#wpforo #wpforo-wrap .mce-edit-area {
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) !important;
}

#wpforo #wpforo-wrap .mce-edit-area:focus-within,
#wpforo #wpforo-wrap .mce-tinymce.mce-focused .mce-edit-area {
	border-color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap .mce-edit-area iframe {
	border-radius: var(--of-radius) !important;
}

#wpforo #wpforo-wrap .mce-btn button,
#wpforo #wpforo-wrap .mce-ico,
#wpforo #wpforo-wrap .mce-txt,
#wpforo #wpforo-wrap .mce-path-item,
#wpforo #wpforo-wrap .mce-statusbar .mce-container-body,
#wpforo #wpforo-wrap .mce-menubar .mce-menubtn button {
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .mce-btn.mce-active,
#wpforo #wpforo-wrap .mce-btn:hover,
#wpforo #wpforo-wrap .mce-menubar .mce-menubtn:hover {
	background: var(--of-bg-card) !important;
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap .mce-menu,
#wpforo #wpforo-wrap .mce-floatpanel {
	background: var(--of-bg-card) !important;
	border-color: var(--of-border) !important;
	box-shadow: var(--of-shadow) !important;
}

#wpforo #wpforo-wrap .mce-menu-item,
#wpforo #wpforo-wrap .mce-text-color .mce-preview,
#wpforo #wpforo-wrap .mce-menu-item .mce-text {
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .mce-menu-item:hover,
#wpforo #wpforo-wrap .mce-menu-item.mce-selected {
	background: rgba(255, 255, 255, 0.06) !important;
}

#wpforo #wpforo-wrap .mce-resizehandle {
	border-color: var(--of-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Add topic / add reply forms
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpf-field {
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpf-field .wpf-label i,
#wpforo #wpforo-wrap .wpf-field .wpf-field-wrap i {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpf-field .wpf-field-required-icon {
	color: var(--of-odds-mid) !important;
}

/* Any field (login, register, account, custom profile fields, add-topic
   fields, etc.) that renders a leading `.wpf-field-icon` needs its
   input/textarea pushed right far enough that placeholder/typed text never
   sits underneath the icon. wpForo's own CSS only widens this gap for the
   login form specifically (34px) — everywhere else the default field
   padding (28px) barely clears a ~14-17px wide icon starting at 10px, so we
   apply a consistently generous gap everywhere an icon is actually present,
   leaving icon-less fields untouched via the sibling combinator below. */
#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ input[type="text"],
#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ input[type="password"],
#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ input[type="email"],
#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ input[type="url"],
#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ input[type="tel"],
#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ input[type="number"],
#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ input[type="date"] {
	padding-left: 38px !important;
}

#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon ~ textarea,
#wpforo #wpforo-wrap .wpf-field-type-textarea .wpf-field-wrap .wpf-field-icon ~ textarea {
	padding-left: 40px !important;
}

/* The show/hide password toggle sits on the right instead, appended after
   the input — reserve matching space there so typed text doesn't run under
   the eye icon either. */
#wpforo #wpforo-wrap .wpf-field-wrap input[type="password"] {
	padding-right: 38px !important;
}

#wpforo #wpforo-wrap .wpf-field-wrap .wpf-field-icon,
#wpforo #wpforo-wrap .wpforo-login-wrap .wpf-field-icon {
	z-index: 1;
}

#wpforo #wpforo-wrap .wpf-table .wpfw-1 .wpf-field:nth-child(even) {
	background-color: rgba(255, 255, 255, 0.02) !important;
}

#wpforo #wpforo-wrap .wpf-add-topic-title {
	border: 1px dashed var(--of-accent) !important;
	color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpf-acp-header {
	border-bottom: 1px dashed var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpf-acp-header .wpf-acp-toggle i,
#wpforo #wpforo-wrap .wpf-acp-title {
	color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpf-acp-title,
#wpforo #wpforo-wrap .wpf-acp-content,
#wpforo #wpforo-wrap .wpf-acp-footer {
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpf-acp-content a.wpf-button-secondary,
#wpforo #wpforo-wrap .wpf-acp-footer a.wpf-button-secondary {
	background: var(--of-bg-secondary) !important;
	box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Members list & search
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpforo-members-wrap .wpforo-members-content {
	/* Wins over the generic ".wpfbg-7{background:#e6e6e6!important}" utility
	   class wpForo also applies here — same !important, but this selector's
	   ID-anchored specificity outranks a bare single-class rule regardless
	   of source order, so it safely overrides just this one usage without
	   touching .wpfbg-7 anywhere else it's used (status dots, badges, etc). */
	background: var(--of-bg-secondary) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) !important;
	overflow: hidden;
}

#wpforo #wpforo-wrap .wpforo-members-wrap td.wpf-members-search,
#wpforo #wpforo-wrap .wpforo-members-wrap td.wpf-members-regdate-head,
#wpforo #wpforo-wrap .wpforo-members-wrap td.wpf-members-foot {
	border-color: var(--of-border) !important;
	background: var(--of-bg-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-members-wrap td.wpf-members-avatar {
	border-right: 2px solid var(--of-bg-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-members-content table tr {
	background-color: var(--of-bg-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-members-content table tr:nth-child(even) {
	background-color: var(--of-bg-card) !important;
}

/* --------------------------------------------------------------------------
   Search & Recent Posts result tables
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap #wpforo-search-title,
#wpforo #wpforo-wrap #wpforo-recent-title {
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-search-wrap .wpf-search-bar,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpf-recent-bar {
	background: var(--of-bg-secondary) !important;
	border: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-search-wrap .wpf-search-bar .wpfltd,
#wpforo #wpforo-wrap .wpforo-search-wrap .wpf-search-bar .wpfrtd,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpf-recent-bar .wpfltd,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpf-recent-bar .wpfrtd {
	border-bottom: 1px dotted var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-search-wrap .wpforo-search-content,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpforo-recent-content {
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-search-wrap .wpforo-search-content .wpf-ptr,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpforo-recent-content .wpf-ptr {
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-search-wrap .wpforo-search-content .wpf-htr,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpforo-recent-content .wpf-htr {
	background-color: var(--of-bg-card) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-search-wrap .wpforo-search-content .wpf-ttr,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpforo-recent-content .wpf-ttr {
	background: transparent !important;
}

#wpforo #wpforo-wrap .wpforo-search-wrap .wpforo-search-content td.wpf-shead-icon,
#wpforo #wpforo-wrap .wpforo-search-wrap .wpforo-search-content td.wpf-spost-icon,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpforo-recent-content td.wpf-shead-icon,
#wpforo #wpforo-wrap .wpforo-recent-wrap .wpforo-recent-content td.wpf-spost-icon {
	border-right: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-recent-wrap .wpforo-recent-content td.wpf-stext {
	color: var(--of-text-secondary) !important;
}

/* --------------------------------------------------------------------------
   Forum Statistics widget & sidebar widgets
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap #wpforo-stat-header {
	background-color: var(--of-bg-secondary) !important;
	color: var(--of-text-primary) !important;
	border-bottom: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius) var(--of-radius) 0 0 !important;
}

#wpforo #wpforo-wrap #wpforo-stat-body {
	border: 1px solid var(--of-border) !important;
	border-top: none !important;
	background: var(--of-bg-card) !important;
	border-radius: 0 0 var(--of-radius) var(--of-radius) !important;
}

#wpforo #wpforo-wrap #wpforo-stat-body .wpf-stat-item {
	border-right: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap #wpforo-stat-body .wpf-stat-item i,
#wpforo #wpforo-wrap #wpforo-stat-body .wpf-stat-item .wpf-stat-value,
#wpforo #wpforo-wrap #wpforo-stat-body .wpf-stat-item .wpf-stat-label,
#wpforo #wpforo-wrap #wpforo-stat-body .wpf-last-info i {
	color: var(--of-text-muted) !important;
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap #wpforo-stat-body .wpf-new i,
#wpforo #wpforo-wrap #wpforo-stat-body .wpf-all-read i {
	color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap #wpforo-poweredby {
	background-color: var(--of-bg-secondary) !important;
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap #wpforo-poweredby a {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .widget-title,
.wpforo-widget-wrap .widget-title {
	border-bottom: 2px solid var(--of-border) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-widget-wrap .wpforo-widget-content li,
.wpforo-widget-wrap .wpforo-widget-content li {
	border-bottom: 1px dotted var(--of-border) !important;
}

.wpforo-widget-wrap .wpf-widget-tags li a {
	border-color: var(--of-accent) !important;
	color: var(--of-text-secondary) !important;
}

.wpforo-widget-wrap .wpf-widget-tags li span {
	border: 1px solid var(--of-accent) !important;
	background-color: var(--of-accent) !important;
	color: var(--of-bg-primary) !important;
}

.wpforo-widget-wrap .wpf-widget-tags li a:hover {
	background-color: var(--of-accent) !important;
	color: var(--of-bg-primary) !important;
}

#wpf-widget-online-users .wpforo-widget-content a.onlineuser,
#wpf-widget-online-users .wpforo-widget-content a.onlineavatar {
	border: 1px solid var(--of-border) !important;
}

/* Header profile / notifications widget dropdown */
#wpf-widget-profile .wpf-prof-header .wpf-prof-info,
#wpf-widget-profile .wpf-prof-header .wpf-prof-alerts,
#wpf-widget-profile .wpf-prof-content {
	border-bottom: 1px dashed var(--of-border) !important;
}

#wpf-widget-profile .wpf-prof-header .wpf-prof-name {
	color: var(--of-text-primary) !important;
}

#wpf-widget-profile .wpf-prof-header .wpf-prof-alerts .wpf-bell i {
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
}

#wpf-widget-profile .wpf-prof-header .wpf-prof-alerts .wpf-bell i:hover {
	color: var(--of-text-primary) !important;
}

#wpf-widget-profile .wpf-prof-notifications .wpf-notifications {
	background: var(--of-bg-card) !important;
	border: 1px solid var(--of-border) !important;
	border-top: none !important;
	box-shadow: var(--of-shadow) !important;
}

#wpf-widget-profile .wpf-prof-content .wpf-prof-data span.wpf-member-title {
	color: var(--of-text-muted) !important;
}

#wpf-widget-profile .wpf-prof-footer .wpf-prof-buttons a {
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
}

#wpf-widget-profile .wpf-prof-footer .wpf-prof-buttons a:hover {
	color: var(--of-text-primary) !important;
	background: var(--of-border) !important;
}

#wpf-widget-profile .wpf-prof-footer .wpf-prof-buttons a.wpf-logout {
	color: var(--of-odds-worst) !important;
}

/* --------------------------------------------------------------------------
   Profile page
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpforo-profile-wrap .wpforo-profile-content {
	background: var(--of-bg-primary) !important;
	border-color: transparent !important;
}

/* ".rating-bar-cell" and ".wpforo-profile-content" both carry wpForo's
   ".wpfbg-7" light-grey utility class — override here with ID-anchored
   specificity so it doesn't leak a light box into the dark profile page. */
#wpforo #wpforo-wrap .rating-bar-cell {
	background: var(--of-bg-card) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .h-header .wpfy,
#wpforo #wpforo-wrap .wpforo-profile-wrap .wpforo-profile-head-bg .wpfx {
	background: var(--of-bg-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .h-bottom {
	border-bottom: 2px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .h-bottom .wpf-profile-menu {
	border-right: 1px solid var(--of-border) !important;
	color: var(--of-text-secondary) !important;
	background: var(--of-bg-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .h-bottom .wpf-profile-menu:hover,
#wpforo #wpforo-wrap .wpforo-profile-head .wpforo-active,
#wpforo #wpforo-wrap .wpforo-profile-head #wpforo-menu a:hover,
#wpforo #wpforo-wrap .wpforo-profile-head #wpforo-menu .current-menu-ancestor,
#wpforo #wpforo-wrap .wpforo-profile-head #wpforo-menu .current-menu-parent,
#wpforo #wpforo-wrap .wpforo-profile-head #wpforo-menu .current_page_item {
	background-color: var(--of-bg-card) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .profile-display-name,
#wpforo #wpforo-wrap .wpforo-profile-wrap .profile-stat-data,
#wpforo #wpforo-wrap .wpforo-profile-wrap .profile-stat-data-item {
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .wpf-username {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .profile-rating-bar-wrap {
	background: var(--of-bg-primary) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .wpforo-profile-label,
#wpforo #wpforo-wrap .wpforo-profile-wrap .wpforo-profile-field,
#wpforo #wpforo-wrap .wpforo-profile-wrap .wpforo-profile-home .wpf-field {
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .wpforo-profile-home .wpf-field-name-about .wpf-label-wrap {
	border-bottom: 1px dotted var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpf-profile-section {
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .wpf-profile-section .wpf-profile-section-head {
	border-bottom: 1px solid var(--of-border) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-profile-section .wpf-statbox .wpf-statbox-title {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .wpf-profile-plugin-menu .wpf-pp-menu .wpf-pp-menu-item {
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap .wpf-profile-plugin-menu .wpf-pp-menu .wpf-pp-menu-item:hover {
	color: var(--of-accent) !important;
}

#wpforo #wpforo-wrap .wpforo-profile-wrap #wpf-pp-forum-menu .wpf-pp-menu-item {
	color: var(--of-accent) !important;
	border-right: 1px solid var(--of-accent) !important;
}

/* --------------------------------------------------------------------------
   Login / Register (native wpForo pages, if used)
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpforo-register-wrap .wpforo-register-content,
#wpforo #wpforo-wrap .wpforo-login-wrap .wpforo-login-content {
	border-top: 1px solid var(--of-accent) !important;
	border-bottom: 1px solid var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-register-wrap .wpforo-register-content h3,
#wpforo #wpforo-wrap .wpforo-login-wrap .wpforo-login-content h3 {
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-please-login {
	background-color: var(--of-bg-secondary) !important;
	border-radius: var(--of-radius) !important;
	padding: 16px !important;
}

#wpforo #wpforo-wrap .wpforo-login-wrap .wpforo-login-table,
#wpforo #wpforo-wrap .wpforo-register-wrap .wpforo-register-table,
#wpforo #wpforo-wrap .wpforo-table .wpfw-1 .wpf-field:nth-child(even) {
	background-color: var(--of-bg-secondary) !important;
}

#wpforo #wpforo-wrap .wpforo-login-wrap .wpfcl-1,
#wpforo #wpforo-wrap .wpforo-login-wrap a.wpf-forgot-pass {
	color: var(--of-text-muted) !important;
}

/* --------------------------------------------------------------------------
   jQuery UI Dialogs / popovers / tooltips
   -------------------------------------------------------------------------- */
.ui-dialog {
	background: var(--of-bg-secondary) !important;
	border: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius-lg) !important;
	box-shadow: var(--of-shadow) !important;
}

.ui-dialog .ui-widget-header {
	background-color: var(--of-bg-card) !important;
	border-bottom: 1px solid var(--of-border) !important;
	border-radius: var(--of-radius-lg) var(--of-radius-lg) 0 0 !important;
}

.ui-dialog .ui-widget-header span.ui-dialog-title {
	color: var(--of-text-primary) !important;
}

.ui-dialog .ui-dialog-titlebar-close {
	color: var(--of-text-muted) !important;
	background: transparent !important;
	border: none !important;
}

.ui-dialog .ui-dialog-titlebar-close:hover {
	color: var(--of-text-primary) !important;
}

.ui-dialog .ui-dialog-content,
.ui-widget-content {
	background: var(--of-bg-secondary) !important;
	color: var(--of-text-secondary) !important;
}

.ui-widget-overlay {
	background: #000 !important;
	opacity: 0.6 !important;
}

#wpforo [wpf-tooltip]::after {
	background: var(--of-bg-card) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-popover .wpf-popover-content {
	background: var(--of-bg-card) !important;
	color: var(--of-text-secondary) !important;
	box-shadow: var(--of-shadow) !important;
}

#wpforo #wpforo-wrap .wpf-popover .wpf-popover-content i:hover {
	background: rgba(255, 255, 255, 0.08) !important;
}

/* --------------------------------------------------------------------------
   Copy-link widget, spoiler, dropzone, revisions, portable form
   -------------------------------------------------------------------------- */
.wpforo-copy-url-wrap .wpforo-copy-input-body,
.wpforo-copy-url-wrap .wpforo-copy-url-label {
	background-color: var(--of-bg-card) !important;
	border-color: var(--of-border) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-spoiler-wrap {
	background-color: var(--of-bg-card) !important;
}

#wpforo #wpforo-wrap .wpforo-revisions-wrap {
	border-color: var(--of-border) !important;
}

#wpforo #wpforo-wrap .wpforo-revision {
	background-color: var(--of-bg-card) !important;
	box-shadow: none !important;
}

#wpforo #wpforo-wrap .wpforo-revision .wpforo-revision-top {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpforo-revisions-wrap .wpforo-revision-body {
	background-color: var(--of-bg-primary) !important;
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .wpf-topic-form-wrap > .wpf-extra-fields {
	border-top: 1px solid var(--of-border) !important;
}

/* --------------------------------------------------------------------------
   Legal / rules acceptance buttons
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpforo-legal-rules .wpflegal-rules-buttons .wpflegal-rules-button,
#wpforo #wpforo-wrap .wpforo-legal-privacy .wpflegal-privacy-buttons .wpflegal-privacy-button {
	border: 1px dotted var(--of-border) !important;
	color: var(--of-text-secondary) !important;
}

/* --------------------------------------------------------------------------
   Tools & AI Helper panels
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .wpf-tools {
	background: var(--of-bg-secondary) !important;
	border-bottom: 1px solid var(--of-border) !important;
	outline: none !important;
}

#wpforo #wpforo-wrap .wpf-tools .wpf-tool h3 {
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-tools .wpf-tool .wpf-tool-desc {
	color: var(--of-text-muted) !important;
}

#wpforo #wpforo-wrap .wpf-ai-pref-input {
	background: var(--of-bg-card) !important;
	border: 1px solid var(--of-border) !important;
	color: var(--of-text-primary) !important;
}

#wpforo #wpforo-wrap .wpf-ai-moderation-report {
	background: var(--of-bg-card) !important;
	border-color: var(--of-border) !important;
	color: var(--of-text-secondary) !important;
}

#wpforo #wpforo-wrap .wpf-ai-suggestions-no-results,
#wpforo #wpforo-wrap .wpf-ai-loading-text-inline {
	color: var(--of-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Mobile responsive tweaks
   -------------------------------------------------------------------------- */
@media screen and (max-width: 600px) {
	#wpforo #wpforo-wrap #wpforo-menu .wpf-menu {
		background-color: var(--of-bg-secondary) !important;
	}
}

@media screen and (max-width: 767px) {
	#wpforo #wpforo-menu {
		flex-wrap: wrap;
		height: auto !important;
		padding: 10px 14px !important;
	}

	#wpforo ul.wpf-menu {
		flex-wrap: wrap;
	}

	#wpforo ul.wpf-menu > li > a {
		height: 44px !important;
	}
}

/* --------------------------------------------------------------------------
   Site-wide share widget (of-entry-share-wrap, see inc/helpers.php) reused
   on topic pages via of_wpforo_render_share_buttons() in inc/wpforo.php —
   same AddToAny-on-desktop / native-share-sheet-on-mobile widget as
   news/preview posts, instead of wpForo's own (buggy) share buttons.
   The buttons already carry their own explicit colors, so this just adds
   layout/spacing and neutralizes wpForo's global `a{border:none}` /
   `button` resets from fighting the widget's own look.
   -------------------------------------------------------------------------- */
#wpforo #wpforo-wrap .of-wpforo-share {
	margin: 14px 0 20px;
}

#wpforo #wpforo-wrap .of-entry-share-wrap {
	display: flex;
	align-items: center;
}

#wpforo #wpforo-wrap .of-entry-share__btn,
#wpforo #wpforo-wrap .of-entry-share__btn--native {
	color: #fff !important;
}

#wpforo #wpforo-wrap .of-entry-share__btn:hover,
#wpforo #wpforo-wrap .of-entry-share__btn:focus-visible {
	color: #fff !important;
}

/*
 * wpForo's classic theme resets every <span> inside #wpforo-wrap to
 * display:inline (themes/classic/style.css:39 — an ID-based selector, so
 * it always beats AddToAny's own class-based rules). AddToAny sizes each
 * icon via a child <span> (width/height are ignored on inline elements
 * per spec), so once display collapses to inline the icon has no box to
 * render into — the anchor itself is present and non-empty, it just has
 * zero visible area. Restore the box model AddToAny expects, scoped to
 * just its own kit so nothing else inside the forum is affected.
 */
#wpforo #wpforo-wrap .of-entry-share-wrap__addtoany .a2a_kit span {
	display: inline-block !important;
}