/* Sleeves Up over wpForo 3.1.5 (theme "2026", forum layout wpfl-4).
 *
 * wpForo ships a generated sheet, uploads/wpforo/assets/colors.css, whose every rule
 * is prefixed `#wpforo #wpforo-wrap` (two IDs) and which is enqueued at
 * wp_enqueue_scripts priority 999. An earlier version of this file used a single
 * `#wpforo` prefix and lost every cascade. So: the same two-ID prefix as wpForo's own,
 * and functions.php now enqueues this sheet after `wpforo-dynamic-style`. Equal
 * specificity, later source order, no !important needed except where wpForo itself
 * declares one (each of those is marked below).
 *
 * This sheet is only enqueued on forum pages, so it cannot reach the front page.
 */

#wpforo {
	--su-ink: var(--wp--preset--color--contrast, #171512);
	--su-ivory: var(--wp--preset--color--base, #F2EDE3);
	--su-card: var(--wp--preset--color--accent-5, #E8E4DC);
	--su-deep: var(--wp--preset--color--accent-2, #2C6B79);
	--su-cuff: var(--wp--preset--color--accent-1, #5AA3B2);
	--su-muted: var(--wp--preset--color--accent-4, #6B6259);
	--su-line: var(--wp--preset--color--border-light, #D6CEC0);
	--su-mont: var(--wp--preset--font-family--montserrat, Montserrat, "Helvetica Neue", Arial, sans-serif);
	--su-body: var(--wp--preset--font-family--system, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif);
}

/* ------------------------------------------------------------------ *
 * 1. Reading width
 * ------------------------------------------------------------------ *
 * The page content is a constrained layout, so every child is capped at the
 * theme's content size (760px); wpForo then splits that into a 71% column plus a
 * sidebar, which left about 530px of usable table on a 1440 viewport. Promote the
 * forum wrapper alone to the theme's wide size. The sidebar stays (it now carries
 * deliberate copy) and wpForo's own percentage split and 800px stacking breakpoint
 * are untouched, so responsive behaviour is unchanged.
 */
.entry-content > #wpforo,
.wp-block-post-content > #wpforo {
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1200px);
	margin-left: auto;
	margin-right: auto;
}

/* The page title above the forum has to move with it, or its left edge sits 220px
   inboard of the forum's. Scoped with :has() as well as by the conditional enqueue,
   so it can never widen a title on a page that has no forum on it. */
body:has(#wpforo) .wp-block-post-title {
	max-width: var(--wp--style--global--wide-size, 1200px);
}

/* ------------------------------------------------------------------ *
 * 2. Surfaces and type
 * ------------------------------------------------------------------ */

#wpforo #wpforo-wrap {
	font-family: var(--su-body);
	/* wpForo's stored custom CSS pins 13px on a single-ID selector; two IDs beat it. */
	font-size: 15px;
	line-height: 1.6;
	color: var(--su-ink);
	background: transparent;
	padding: 0;
}

#wpforo #wpforo-wrap input,
#wpforo #wpforo-wrap textarea,
#wpforo #wpforo-wrap select,
#wpforo #wpforo-wrap button {
	font-family: var(--su-body);
}

#wpforo #wpforo-wrap h1,
#wpforo #wpforo-wrap h2,
#wpforo #wpforo-wrap h3,
#wpforo #wpforo-wrap h4,
#wpforo #wpforo-wrap #wpforo-title {
	font-family: var(--su-mont);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--su-ink);
	margin-top: 0;
}

#wpforo #wpforo-wrap #wpforo-title {
	font-size: 1.6rem;
	padding-bottom: 0.4rem;
}

#wpforo #wpforo-wrap #wpforo-description {
	color: var(--su-muted);
}

/* Links: Cuff Deep is the only blue allowed as text on a light ground. */
#wpforo #wpforo-wrap a,
#wpforo #wpforo-wrap a:visited,
#wpforo #wpforo-wrap .wpf-link,
#wpforo #wpforo-wrap .wpflink {
	color: var(--su-deep);
}

#wpforo #wpforo-wrap a svg,
#wpforo #wpforo-wrap a:visited svg {
	fill: var(--su-deep);
}

#wpforo #wpforo-wrap a:hover,
#wpforo #wpforo-wrap a:active,
#wpforo #wpforo-wrap .wpflink:hover {
	color: var(--su-ink);
}

#wpforo #wpforo-wrap a:hover svg,
#wpforo #wpforo-wrap a:active svg {
	fill: var(--su-ink);
}

/* ------------------------------------------------------------------ *
 * 3. Tab bar
 * ------------------------------------------------------------------ */

#wpforo #wpforo-wrap #wpforo-menu {
	background: var(--su-card);
	border-bottom: 2px solid var(--su-line);
}

#wpforo #wpforo-wrap #wpforo-menu li {
	border-bottom: 2px solid transparent;
}

#wpforo #wpforo-wrap #wpforo-menu li a {
	font-family: var(--su-mont);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.02em;
	color: var(--su-ink);
	text-decoration: none;
	padding: 16px 20px;
}

/* Active and hover: ivory tab, Cuff Deep rule. */
#wpforo #wpforo-wrap #wpforo-menu #wpf-menu .wpforo-active,
#wpforo #wpforo-wrap #wpforo-menu #wpf-menu li.wpforo-active,
#wpforo #wpforo-wrap #wpforo-menu #wpf-menu li:hover,
#wpforo #wpforo-wrap #wpforo-menu #wpf-menu li.current-menu-ancestor,
#wpforo #wpforo-wrap #wpforo-menu #wpf-menu li.current-menu-parent,
#wpforo #wpforo-wrap #wpforo-menu #wpf-menu li.current_page_item {
	background-color: var(--su-ivory);
}

#wpforo #wpforo-wrap #wpforo-menu li.wpforo-active,
#wpforo #wpforo-wrap #wpforo-menu li:hover,
#wpforo #wpforo-wrap #wpforo-menu li.current-menu-ancestor,
#wpforo #wpforo-wrap #wpforo-menu li.current-menu-parent,
#wpforo #wpforo-wrap #wpforo-menu li.current_page_item {
	border-bottom: 2px solid var(--su-deep);
}

#wpforo #wpforo-wrap #wpforo-menu li:hover > a {
	color: var(--su-deep);
}

#wpforo #wpforo-wrap #wpforo-menu li > ul {
	background-color: var(--su-card);
}

#wpforo #wpforo-wrap #wpforo-menu li > ul li {
	border-bottom: 1px solid var(--su-line);
}

#wpforo #wpforo-wrap #wpforo-menu li > ul li:hover,
#wpforo #wpforo-wrap #wpforo-menu li > ul li.current-menu-item {
	border-bottom: 1px solid var(--su-deep);
}

#wpforo #wpforo-wrap #wpforo-menu .wpf-res-menu,
#wpforo #wpforo-wrap #wpforo-menu .wpf-res-menu i {
	color: var(--su-ink);
}

/* Search field in the bar. */
#wpforo #wpforo-wrap .wpf-search input[type="text"] {
	color: var(--su-ink);
	background: transparent;
	border-bottom: 1px solid var(--su-line);
}

#wpforo #wpforo-wrap .wpf-search input[type="text"]:focus {
	background: var(--su-ivory);
	outline: 2px solid var(--su-deep);
	outline-offset: 1px;
}

#wpforo #wpforo-wrap .wpf-search i {
	color: var(--su-deep);
}

/* ------------------------------------------------------------------ *
 * 4. Breadcrumb
 * ------------------------------------------------------------------ *
 * The chevrons are rotated squares that must carry the colour of the surface
 * behind them, otherwise wpForo's white notches show through the ivory ground.
 */

#wpforo #wpforo-wrap .wpf-breadcrumb div {
	font-family: var(--su-mont);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.02em;
	color: var(--su-muted);
}

#wpforo #wpforo-wrap .wpf-breadcrumb a {
	color: var(--su-deep);
}

#wpforo #wpforo-wrap .wpf-breadcrumb a:hover {
	color: var(--su-ink);
}

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

#wpforo #wpforo-wrap .wpf-breadcrumb div:after {
	background: var(--su-ivory);
}

#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(--su-card);
}

#wpforo #wpforo-wrap .wpf-breadcrumb div.active {
	color: var(--su-ink);
}

/* ------------------------------------------------------------------ *
 * 5. Category header, the one ink band on the page
 * ------------------------------------------------------------------ */

#wpforo #wpforo-wrap .wpforo-cat-panel {
	background: var(--su-ink);
	color: var(--su-ivory);
	border-radius: 0;
}

#wpforo #wpforo-wrap .wpforo-cat-panel .cat-title,
#wpforo #wpforo-wrap .wpforo-cat-panel .cat-name {
	font-family: var(--su-mont);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--su-ivory);
}

#wpforo #wpforo-wrap .wpforo-cat-panel .cat-icon i,
#wpforo #wpforo-wrap .wpforo-cat-panel .wpf-head-bar-left i {
	color: var(--su-cuff);
}

#wpforo #wpforo-wrap .wpforo-cat-panel a {
	color: var(--su-cuff);
}

#wpforo #wpforo-wrap .wpforo-cat-panel a:hover {
	color: var(--su-ivory);
}

/* ------------------------------------------------------------------ *
 * 6. Forum list and topic table
 * ------------------------------------------------------------------ */

#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item {
	border-bottom: 1px solid var(--su-line);
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item:nth-child(even) {
	border-left: 3px solid transparent;
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item a {
	font-family: var(--su-mont);
	font-weight: 700;
	color: var(--su-ink);
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item a:hover {
	color: var(--su-deep);
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-cat-forum-list .wpf-forum-item .wpf-forum-item-stat {
	color: var(--su-muted);
	background-color: var(--su-card);
	border-radius: 2px;
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-head {
	background: var(--su-card);
	border-bottom: 1px solid var(--su-line);
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-head .wpf-head-box,
#wpforo #wpforo-wrap .wpft-topic .wpfl-4 .wpf-threads-head .wpf-head-box {
	font-family: var(--su-mont);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--su-ink);
}

#wpforo #wpforo-wrap .wpft-topic .wpfl-4 .wpf-threads-head {
	background: var(--su-ink);
	border-bottom: 2px solid var(--su-line);
}

#wpforo #wpforo-wrap .wpft-topic .wpfl-4 .wpf-threads-head .wpf-head-box {
	color: var(--su-ivory);
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-thread-body {
	color: var(--su-ink);
}

#wpforo #wpforo-wrap .wpfl-4 .wpf-threads-label {
	border-bottom: 1px dashed var(--su-line);
	color: var(--su-muted);
}

#wpforo #wpforo-wrap .wpf-head-bar {
	background-color: var(--su-card);
	border-bottom: 1px solid var(--su-line);
}

/* ------------------------------------------------------------------ *
 * 7. Buttons
 * ------------------------------------------------------------------ *
 * Brand button: ink fill, ivory label, 15.62:1. This also catches the block
 * editor's .wp-element-button, which is what the sidebar widgets render, since
 * wpForo's sidebar was previously producing a near-black label on a near-black pill.
 */

#wpforo #wpforo-wrap .wpf-button,
#wpforo #wpforo-wrap input[type="submit"],
#wpforo #wpforo-wrap button[type="submit"],
#wpforo #wpforo-wrap .wp-element-button,
#wpforo #wpforo-wrap .wp-block-search__button,
#wpforo #wpforo-wrap .wp-block-button__link {
	font-family: var(--su-mont);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.01em;
	/* wpForo declares `color:#ffffff!important` on .wpf-button; matching it is the
	   only way to put an ivory label on the ink fill. */
	color: var(--su-ivory) !important;
	background: var(--su-ink);
	border: 1px solid var(--su-ink);
	border-radius: 2px;
	box-shadow: none;
	text-shadow: none;
	text-decoration: none;
	cursor: pointer;
}

/* wpForo zeroes padding on links and inputs inside its wrapper, which flattens the
   block editor's buttons to a bare label. wpForo's own .wpf-button keeps the padding
   it declares !important, so only the block/HTML buttons are re-padded here. */
#wpforo #wpforo-wrap input[type="submit"],
#wpforo #wpforo-wrap button[type="submit"],
#wpforo #wpforo-wrap .wp-element-button,
#wpforo #wpforo-wrap .wp-block-search__button,
#wpforo #wpforo-wrap .wp-block-button__link {
	display: inline-block;
	padding: 0.7rem 1.3rem;
	line-height: 1.2;
}

#wpforo #wpforo-wrap .wpf-button:hover,
#wpforo #wpforo-wrap input[type="submit"]:hover,
#wpforo #wpforo-wrap button[type="submit"]:hover,
#wpforo #wpforo-wrap .wp-element-button:hover,
#wpforo #wpforo-wrap .wp-block-search__button:hover,
#wpforo #wpforo-wrap .wp-block-button__link:hover {
	/* Same !important reason as above. */
	color: var(--su-ivory) !important;
	background: var(--su-deep);
	border-color: var(--su-deep);
}

/* "Add topic" sits on the ink category band, so it flips to the accent fill:
   Cuff Blue with an ink label, 6.35:1. */
#wpforo #wpforo-wrap .wpforo-category .wpf-button {
	/* wpForo: `color:#43a6df!important` on this exact selector. */
	color: var(--su-ink) !important;
	background: var(--su-cuff);
	border: 1px solid var(--su-cuff);
	box-shadow: none;
}

#wpforo #wpforo-wrap .wpforo-category .wpf-button:hover {
	color: var(--su-ink) !important;
	background: var(--su-ivory);
	border-color: var(--su-ivory);
	box-shadow: none;
}

#wpforo #wpforo-wrap .wpf-button-secondary {
	/* wpForo ships this rule fully !important, all three properties. */
	font-family: var(--su-mont) !important;
	color: var(--su-ink) !important;
	background: var(--su-card) !important;
	border: 1px solid var(--su-line) !important;
}

#wpforo #wpforo-wrap .wpf-button-outlined {
	color: var(--su-deep);
	border: 1px solid var(--su-deep);
	background: transparent;
}

#wpforo #wpforo-wrap .wpf-button-outlined:hover {
	color: var(--su-ivory);
	background: var(--su-deep);
	box-shadow: none;
}

/* Share row. */
#wpforo #wpforo-wrap .wpf-sbtn .wpf-sb-button,
#wpforo #wpforo-wrap .wpf-sb-style-grey .wpf-sb-button {
	color: var(--su-ink);
	background: transparent;
	border: 1px solid var(--su-line);
	border-radius: 2px;
}

#wpforo #wpforo-wrap .wpf-sbtn .wpf-sb-button:hover {
	color: var(--su-ivory);
	background: var(--su-ink);
	border-color: var(--su-ink);
}

#wpforo #wpforo-wrap .wpf-sbtn-title {
	color: var(--su-muted);
}

/* ------------------------------------------------------------------ *
 * 8. Sidebar widgets
 * ------------------------------------------------------------------ */

#wpforo #wpforo-wrap .wpforo-right-sidebar {
	font-size: 15px;
}

#wpforo #wpforo-wrap .wpforo-right-sidebar > aside {
	background: var(--su-card);
	border: 1px solid var(--su-line);
	padding: 1.1rem 1.2rem;
	margin-bottom: 1.2rem;
}

#wpforo #wpforo-wrap .wpforo-right-sidebar h2,
#wpforo #wpforo-wrap .wpforo-right-sidebar h3 {
	font-family: var(--su-mont);
	font-weight: 800;
	font-size: 1.05rem;
	line-height: 1.25;
	margin: 0 0 0.6rem;
	color: var(--su-ink);
}

#wpforo #wpforo-wrap .wpforo-right-sidebar p {
	margin: 0 0 0.8rem;
	color: var(--su-ink);
}

#wpforo #wpforo-wrap .wpforo-right-sidebar p:last-child {
	margin-bottom: 0;
}

#wpforo #wpforo-wrap .wpforo-right-sidebar .wp-block-button {
	margin-bottom: 0;
}

/* ------------------------------------------------------------------ *
 * 9. Forum information footer
 * ------------------------------------------------------------------ */

#wpforo #wpforo-wrap #wpforo-stat-header .wpf-footer-title {
	font-family: var(--su-mont);
	font-weight: 700;
	color: var(--su-ink);
	border-bottom: 3px solid var(--su-deep);
}

#wpforo #wpforo-wrap .wpf-footer-box {
	background-color: var(--su-card);
	color: var(--su-ink);
}

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

#wpforo #wpforo-wrap #wpforo-stat-body .wpf-stat-item i {
	color: var(--su-muted);
}

#wpforo #wpforo-wrap #wpforo-stat-body .wpf-stat-item .wpf-stat-value {
	font-family: var(--su-mont);
	font-weight: 800;
	color: var(--su-ink);
}

#wpforo #wpforo-wrap #wpforo-stat-body .wpf-stat-item .wpf-stat-label {
	border-top: 1px dotted var(--su-line);
	color: var(--su-muted);
}

#wpforo #wpforo-wrap #wpforo-footer .wpf-forum-icons,
#wpforo #wpforo-wrap #wpforo-footer .wpf-topic-icons {
	color: var(--su-muted);
}

#wpforo #wpforo-wrap #wpforo-poweredby a {
	color: var(--su-muted);
	font-size: 11px;
}

/* ------------------------------------------------------------------ *
 * 10. Misc surfaces wpForo paints white or grey
 * ------------------------------------------------------------------ */

#wpforo #wpforo-wrap .wpforo-topic-badges,
#wpforo #wpforo-wrap .wpf-page-message-text {
	background-color: var(--su-card);
	color: var(--su-ink);
}

#wpforo #wpforo-wrap .wpf-notifications {
	border-color: var(--su-line);
}

#wpforo #wpforo-wrap pre,
#wpforo #wpforo-wrap code {
	border: 1px solid var(--su-line);
	background: var(--su-card);
}
