/* FH Server Menu — CoD4 emblem for the "Servers" menu item.
   Two 40px assets (retina) rendered at ~16px: color for light bars, white silhouette for dark FA-style bars. No theme files are modified:
   this stylesheet and the image live as NEW files under Themes/default/. */

/* Curve2 family: the mod's icon key 'fhservers' -> <span class="main_icons fhservers">.
   Curve2 draws main_icons on the ::before pseudo-element; paint the emblem there only,
   and blank the span itself so the sprite fallback can't render a second copy. */
li:not(.nav-item).button_server > a > .main_icons.fhservers {
	background-image: none !important;
}
li:not(.nav-item).button_server > a > .main_icons.fhservers::before {
	background-image: url(../images/fhservers-40.png) !important;
	background-size: 16px 16px !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
}

/* Reseller family (.nav-item markup, white FontAwesome glyphs via ::before keyed
   off the button name 'server'): replace the glyph with a WHITE silhouette of the
   emblem (the "4" knocked out so the dark bar shows through) to match its neighbors. */
.nav-item.button_server > a > .main_icons::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	background-image: url(../images/fhservers-white-40.png) !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	vertical-align: -0.15em;
}

/* Reseller layout tweak: center the forum banner in the header band on desktop
   (the theme left-justifies it against the user panel). Desktop-only so the
   user panel can't overlap the banner on narrow screens. Scoped to Reseller's
   header markup (header#header > .content-wrapper); Curve2 has no .content-wrapper. */
@media (min-width: 1100px) {
	header#header > .content-wrapper {
		position: relative;
	}
	header#header > .content-wrapper > h1.forumtitle {
		flex: 1 1 100%;
		text-align: center;
	}
	header#header > .content-wrapper > .user_panel {
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
	}
}

/* Curve2 layout tweak: same centering. Curve2's div#header is a flex row of
   [h1.forumtitle | img#smflogo]; let the title span the row and center it, and
   anchor the SMF logo to the right edge. Desktop-only. Scoped to div#header
   (Reseller's header is a <header> element, so this can't match it). */
@media (min-width: 1100px) {
	div#header {
		position: relative;
	}
	div#header > h1.forumtitle {
		flex: 1 1 100%;
		text-align: center;
	}
	div#header > img#smflogo {
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
	}
}

/* Banner size: the 514x95 image is a little heavy in both headers — cap the
   height (~75%) and let width follow. One rule, both themes. */
#header h1.forumtitle img {
	max-height: 72px;
	width: auto;
}

/* LP menu icon swap: "Portal" is renamed "Home" and should carry the house icon;
   "Forum" (button key 'home', span class main_icons home) gets a boards/chat icon.
   Scoped to the nav buttons so linktree/home icons elsewhere are untouched. */
/* Reseller (FontAwesome via ::before): */
.nav-item.button_portal > a > .main_icons.portal::before {
	content: "\f015"; /* house */
}
.nav-item.button_home > a > .main_icons.home::before {
	content: "\f086"; /* comments */
}
/* Curve2 (main_icons sprite; positions from index.css): */
li:not(.nav-item).button_portal > a > .main_icons.portal::before {
	background-position: -135px -187px; /* house */
}
li:not(.nav-item).button_home > a > .main_icons.home::before {
	background-position: -31px -31px; /* boards */
}

/* FH color pass (Reseller only — its header is <header id="header">, Curve2's is a div):
   1) header band: match the footer slate (#34495e) instead of the bright blue (#3498db);
   2) the green .title_bar/.titlebg (Info Center etc., #00c251) joins the cat_bar slate family. */
header#header {
	background: #34495e !important;
}
body:has(header#header) .title_bar {
	background: #354a5f !important;
	border-color: #2c3e50 !important;
}
body:has(header#header) .title_bar .titlebg,
body:has(header#header) .titlebg,
body:has(header#header) h3.titlebg,
body:has(header#header) h4.titlebg {
	background: none !important;
	color: #fff !important;
}

/* The slate header band needs light text/icons — Reseller's dark navy glyphs
   (#213345) were tuned for the old bright blue and vanish on #34495e. */
header#header,
header#header a,
header#header .user_panel a,
header#header .text-label,
header#header .main_icons,
header#header .main_icons::before {
	color: #ecf0f1 !important;
}
header#header a:hover,
header#header a:hover .main_icons::before,
header#header a:hover .text-label {
	color: #ffffff !important;
}

/* Follow-ups to the light-header pass:
   1) the profile/PM/alerts popups (.top_menu) are WHITE panels inside the header —
      exclude them from the light-text rule (dark text back);
   2) the centered-banner rule makes .user_panel absolute+transform, which starts a
      stacking context — without a z-index its popups get buried under page content. */
header#header .top_menu,
header#header .top_menu a,
header#header .top_menu a:hover,
header#header .top_menu .text-label,
header#header .top_menu .main_icons,
header#header .top_menu .main_icons::before {
	color: #333 !important;
}
header#header > .content-wrapper > .user_panel {
	z-index: 90;
}

/* LP list blocks (Recent Topics/Posts, Board News): Reseller's alternate row stripe
   (#f7f7f7) is nearly the same shade as the roundframe body behind the cards, so
   every second entry looks like loose text floating between cards. Uniform white
   cards instead — the 3.6px gaps + gray body do the delineation. */
.roundframe .recent_topics_list > .windowbg,
.roundframe .recent_topics > .windowbg,
.roundframe .recent_posts_list > .windowbg,
.roundframe .recent_posts > .windowbg,
.roundframe .news_item.windowbg {
	background: #fff !important;
	box-shadow: 0 1px 2px rgba(0,0,0,.06);
}