/* =====================================================================
   Metrova Gaming Roleplay - dark "classic SA-MP forum" theme for MyBB 1.8
   Black carbon background, grey text, blue links, League Gothic headings,
   red login button. Loaded after global.css, so it overrides the defaults.
   ===================================================================== */
@import url(https://fonts.googleapis.com/css2?family=League+Gothic&family=Oswald:wght@500&display=swap);

:root {
	--mg-bg: #000000;
	--mg-panel: #080808;
	--mg-row: #111111;
	--mg-row-alt: #0d0d0d;
	--mg-line: #242424;
	--mg-text: #aaaaaa;
	--mg-muted: #888888;
	--mg-head: #eeeeee;
	--mg-link: #2f8ae0;
	--mg-link-hover: #6fb3ff;
	--mg-red: #c23838;
	--mg-red-dark: #9e1e1e;
	--mg-gothic: 'League Gothic', 'Arial Narrow', Arial, sans-serif;
}

/* ---------- page ---------- */
body {
	background-color: var(--mg-bg);
	background-image:
		repeating-linear-gradient(45deg, rgba(255,255,255,0.025) 0 2px, transparent 2px 4px),
		repeating-linear-gradient(-45deg, rgba(0,0,0,0.6) 0 2px, transparent 2px 4px);
	color: var(--mg-text);
	font: 13px/1.4 Arial, Helvetica, sans-serif;
}
#container { background: transparent; color: var(--mg-text); }
.wrapper { width: auto; max-width: 1100px; min-width: 0; margin: 0 auto; padding: 0 16px; }

a:link, a:visited { color: var(--mg-link); text-decoration: none; }
a:hover, a:active { color: var(--mg-link-hover); text-decoration: underline; }

/* ---------- header: login bar on top, logo, nav tabs ---------- */
#header { display: flex; flex-direction: column; background: transparent; }

#panel { order: -1; }
#panel .upper {
	background: linear-gradient(#141414, #000000);
	border-top: 0; border-bottom: 1px solid var(--mg-line);
	color: var(--mg-muted);
	padding: 8px 0;
}
#panel .upper .wrapper { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#panel .upper a:link, #panel .upper a:visited { color: #dddddd; }
#panel .upper .welcome { color: var(--mg-muted); }
#panel .upper a.login, #panel .upper a.register {
	display: inline-block; padding: 5px 14px; margin-left: 6px;
	background: linear-gradient(var(--mg-red), var(--mg-red-dark));
	border: 1px solid #5e0f0f; border-radius: 3px;
	color: #ffffff !important; font-size: 14px; text-decoration: none;
}
#panel .upper a.login:hover, #panel .upper a.register:hover { filter: brightness(1.15); }
#search input.textbox, #panel input.textbox {
	background: #050505; border: 1px solid #2a2a2a; color: #dddddd; border-radius: 3px; padding: 4px 6px;
}
#search input.button, #panel input.button {
	background: linear-gradient(#2a2a2a, #111111); border: 1px solid #333333; color: #dddddd; border-radius: 3px;
}

/* banner: GTA San Andreas cityscape (images/metrova_banner.jpg), logo on the left, server IP on the right */
#logo {
	background: #000000 url(../../../images/metrova_banner.jpg) center center / cover no-repeat;
	border-bottom: 0;
	padding: 0;
}
#logo .wrapper { display: flex; flex-wrap: wrap; align-items: center; position: relative; min-height: 190px; padding-top: 0; }
#logo .wrapper > a { display: inline-block; margin: 26px 0 26px 0; }
#logo .wrapper > a img { height: 130px; max-height: none; width: auto; filter: drop-shadow(0 3px 8px rgba(0,0,0,0.85)); }
#logo .wrapper::after {
	content: "SERVER IP\A mg-gaming.net:7777";
	white-space: pre; text-align: center;
	position: absolute; right: 16px; top: 50%; transform: translateY(calc(-50% - 17px));
	padding: 9px 18px; border-radius: 4px;
	background: rgba(0,0,0,0.62); border: 1px solid rgba(47,138,224,0.55);
	box-shadow: 0 0 18px rgba(47,138,224,0.25);
	color: #ffffff; font: 26px/1.05 var(--mg-gothic); letter-spacing: .6px;
}
@media (max-width: 760px) {
	#logo .wrapper > a img { height: 90px; }
	#logo .wrapper::after { position: static; transform: none; display: block; order: 1; margin: 0 0 14px 0; font-size: 20px; }
}

/* nav tabs (Portal / Search / Member List / Calendar / Help) */
#logo ul.top_links {
	order: 2; flex-basis: 100%; float: none; margin: 0; padding: 0;
	/* bar background stretched to the full page width, tabs stay aligned with the content */
	border-image: linear-gradient(#262626, #0b0b0b) fill 0 / / 0 100vw;
	border-top: 1px solid #333333; border-bottom: 1px solid #000000;
	display: flex; flex-wrap: wrap; gap: 0;
}
#logo ul.top_links li { margin: 0; padding: 0; display: flex; align-items: center; }
#logo ul.top_links a {
	display: flex; align-items: center; box-sizing: border-box; height: 38px; padding: 4px 18px 0 18px !important; background-image: none !important;   /* !important: MyBB adds 20px icon padding per link */
	font: 500 13px/1 'Oswald', 'Arial Narrow', Arial, sans-serif; letter-spacing: 1.2px; text-transform: uppercase;
	color: #bdbdbd !important; border-bottom: 2px solid transparent; margin-bottom: -1px;
	-webkit-font-smoothing: antialiased;
}
#logo ul.top_links li + li a { box-shadow: inset 1px 0 0 #242424; }          /* one subtle divider */
#logo ul.top_links a:hover { color: #ffffff !important; background: rgba(255,255,255,0.04); border-bottom-color: var(--mg-link); text-decoration: none; }
#logo ul.top_links li:first-child a { color: #ffffff !important; border-bottom-color: var(--mg-link); }

/* ---------- breadcrumb ---------- */
.navigation {
	background: #000000; border-bottom: 1px solid var(--mg-line);
	color: var(--mg-muted); padding: 10px 12px; margin: 0 0 16px 0;
}
.navigation a:link, .navigation a:visited { color: #dddddd; }
.navigation .active { color: #ffffff; font-size: 13px; }

/* ---------- forum tables ---------- */
#content { background: transparent; color: var(--mg-text); padding: 0 0 20px 0; }
.tborder {
	background: var(--mg-panel); border: 1px solid var(--mg-line); border-radius: 4px;
	padding: 0; overflow: hidden; margin-bottom: 18px;
}
.thead {
	background: linear-gradient(#2b2b2b, #0b0b0b);
	border-bottom: 1px solid #000000;
	color: var(--mg-head); padding: 10px 12px;
}
.thead strong, .thead a:link, .thead a:visited {
	color: var(--mg-head); font: 24px/1 var(--mg-gothic); font-weight: normal; letter-spacing: .3px;
}
.thead .smalltext { color: var(--mg-muted); }
.tcat {
	background: #0b0b0b; color: var(--mg-muted); border-top: 1px solid #1a1a1a; border-bottom: 1px solid #000000;
	font-size: 11px; padding: 6px 12px;
}
.tcat a:link, .tcat a:visited { color: var(--mg-muted); }
.trow1, .trow2, .trow_shaded, .trow_selected {
	background: linear-gradient(#141414, var(--mg-row) 40%);
	color: var(--mg-text);
	border-color: #1c1c1c #000000 var(--mg-panel) #1c1c1c; /* top right bottom left: no white MyBB dividers */
}
.tborder td, .tborder th { border-left-color: #1c1c1c; border-right-color: #000000; }
.trow2 { background: linear-gradient(#121212, var(--mg-row-alt) 40%); }
.trow1 strong a, .trow2 strong a { font-size: 15px; font-weight: bold; color: var(--mg-link); }
.trow1 .smalltext, .trow2 .smalltext, .smalltext { color: var(--mg-muted); }
.tfoot { background: #0b0b0b; border-top: 1px solid var(--mg-line); color: var(--mg-muted); }
.tfoot a:link, .tfoot a:visited { color: #cccccc; }
.trow_sep { background: #000; color: #fff; }
.expcolimage img { filter: invert(1) brightness(0.8); }

/* ---------- posts & threads ---------- */
.post { background: var(--mg-row); border: 1px solid var(--mg-line); border-radius: 4px; overflow: hidden; }
.post .post_author { background: linear-gradient(#1a1a1a, #0d0d0d); border-bottom: 1px solid #000; }
.post .post_head { border-bottom: 1px solid var(--mg-line); }
.post .post_body { color: #cccccc; }
.post .post_controls, .post.classic .post_controls { background: #0b0b0b; border-top: 1px solid var(--mg-line); }
.post_author .author_statistics { color: var(--mg-muted); }
blockquote { background: #0b0b0b; border: 1px solid var(--mg-line); color: #bbbbbb; }
blockquote cite { border-bottom: 1px solid var(--mg-line); color: #dddddd; }
.codeblock { background: #050505; border: 1px solid var(--mg-line); color: #cfcfcf; }

/* ---------- forms, buttons, popups ---------- */
input.textbox, textarea, select {
	background: #050505; border: 1px solid #2a2a2a; color: #dddddd; border-radius: 3px;
}
button, input.button, a.button:link, a.button:visited {
	background: linear-gradient(#2a2a2a, #111111); border: 1px solid #333333; color: #dddddd; border-radius: 3px;
}
a.button:hover, input.button:hover, button:hover { filter: brightness(1.2); color: #ffffff; }
.popup_menu, .modal { background: #111111; border: 1px solid var(--mg-line); color: var(--mg-text); }
.popup_menu .popup_item { background: #111111; color: #cccccc; }
.popup_menu .popup_item:hover { background: #1c1c1c; color: #ffffff; }
.pagination a, .pagination .pagination_current { background: #111; border: 1px solid var(--mg-line); color: #ccc; }
.pagination .pagination_current { background: var(--mg-link); color: #fff; }

/* ---------- footer ---------- */
#footer .upper { background: linear-gradient(#1a1a1a, #080808); border-top: 1px solid var(--mg-line); border-bottom: 1px solid #000; }
#footer .upper a:link, #footer .upper a:visited { color: #cccccc; }
#footer .lower { background: #000000; color: var(--mg-muted); }
#footer .lower a:link, #footer .lower a:visited { color: var(--mg-muted); }
.forum_legend dd { color: var(--mg-muted); }

/* ---------- forum status icons: speech bubbles (grey = no new posts, blue = new posts) ---------- */
.forum_status {
	position: relative; display: inline-block; width: 44px; height: 36px;
	background: none !important; vertical-align: middle;
}
.forum_status::before {
	content: ""; position: absolute; left: 4px; top: 4px; width: 32px; height: 22px; border-radius: 5px;
	background:
		linear-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.25)) 7px 7px / 18px 2px no-repeat,
		linear-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.25)) 7px 12px / 13px 2px no-repeat,
		linear-gradient(#f0f0f0, #9a9a9a);
	box-shadow: 0 1px 3px rgba(0,0,0,0.9), inset 0 1px 0 rgba(255,255,255,0.7);
}
.forum_status::after {
	content: ""; position: absolute; left: 10px; top: 25px; width: 0; height: 0;
	border-style: solid; border-width: 7px 8px 0 0; border-color: #9a9a9a transparent transparent transparent;
}
.forum_status.forum_on::before {
	background:
		linear-gradient(rgba(255,255,255,0.55), rgba(255,255,255,0.55)) 7px 7px / 18px 2px no-repeat,
		linear-gradient(rgba(255,255,255,0.55), rgba(255,255,255,0.55)) 7px 12px / 13px 2px no-repeat,
		linear-gradient(#8fcbff, #1f6fc0);
}
.forum_status.forum_on::after { border-top-color: #1f6fc0; }
/* locked forum: small padlock bottom-right */
.forum_status.forum_offclose {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 14 16'%3E%3Cpath d='M3.5 7V5a3.5 3.5 0 0 1 7 0v2' fill='none' stroke='%23bbbbbb' stroke-width='2'/%3E%3Crect x='1' y='7' width='12' height='9' rx='1.5' fill='%23bbbbbb' stroke='%23000' stroke-width='.8'/%3E%3C/svg%3E") no-repeat 28px 18px !important;
}
/* link forum: arrow instead of text lines */
.forum_status.forum_offlink::before { background: linear-gradient(#f0f0f0, #9a9a9a); }
.forum_status.forum_offlink {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12'%3E%3Cpath d='M1 6h11M8 1l5 5-5 5' fill='none' stroke='%23333' stroke-width='2'/%3E%3C/svg%3E") no-repeat 12px 9px !important;
}
.forum_status.forum_offlink::before { z-index: -1; }
/* small versions in the legend and sub-forum lists */
.forum_legend .forum_status { transform: scale(0.6); transform-origin: left center; margin-right: -14px; }

/* ---------- special forum title colours (like NGG) - matched by forum id ---------- */
a[href$="forumdisplay.php?fid=67"] { color: #00ffff !important; }   /* Player Advisor Area */
a[href$="forumdisplay.php?fid=68"] { color: #ff1493 !important; }   /* MultiMedia Team */

/* faction colours = in-game duty colours from the `groups` table (game database) */
:root {
	--fc-executive:   #B2B2B2;   /* Executive Branch      <- group 6 "San Andreas" */
	--fc-legislative: #B2B2B2;   /* Legislative Branch    <- part of the government (no own group) */
	--fc-judicial:    #99CCCC;   /* Judicial Branch       <- group 14 "Judicial" */
	--fc-lspd:        #0000FF;   /* LSPD                  <- group 1 */
	--fc-fdsa:        #FF0000;   /* FDSA                  <- group 15 */
	--fc-saas:        #8BB82D;   /* SAAS                  <- group 12 */
	--fc-sanews:      #FF9A1F;   /* SANews                <- no SANews group in the game yet: placeholder */
	--fc-dga:         #FF3300;   /* Department of Game Affairs <- group 18 */
}
a[href$="forumdisplay.php?fid=60"] { color: var(--fc-dga) !important; }
a[href$="forumdisplay.php?fid=19"] { color: var(--fc-executive) !important; }
a[href$="forumdisplay.php?fid=70"] { color: var(--fc-legislative) !important; }
a[href$="forumdisplay.php?fid=71"] { color: var(--fc-judicial) !important; }
a[href$="forumdisplay.php?fid=21"] { color: var(--fc-lspd) !important; }
a[href$="forumdisplay.php?fid=22"] { color: var(--fc-fdsa) !important; }
a[href$="forumdisplay.php?fid=24"] { color: var(--fc-saas) !important; }
a[href$="forumdisplay.php?fid=23"] { color: var(--fc-sanews) !important; }

/* NGG-style "last post" box on the right of each forum */
.trow1 .smalltext a[href*="action=lastpost"], .trow2 .smalltext a[href*="action=lastpost"] { color: var(--mg-link); }
td.trow1:last-child .smalltext, td.trow2:last-child .smalltext {
	display: inline-block; text-align: left; min-width: 150px;
	background: #0a0a0a; border: 1px solid #1f1f1f; border-radius: 3px; padding: 5px 8px;
}

/* ---------- red/green notices stay readable on black ---------- */
.red_alert { background: #3a0b0b; border: 1px solid #7a1a1a; color: #ffb3b3; }
.pm_alert { background: #0b1a2a; border: 1px solid #1e4a7a; color: #cfe4ff; }