/* =====================================================================
   MGRP Classic - MyBB 1.8 theme in the style of the old vBulletin 4
   NGRP / "MG:RP V2.4" forums: black frame, blue gradient headers, dark
   gradient forum rows, white links, Tahoma. Written from scratch for
   MyBB (CSS gradients only, no images copied from any vBulletin style).
   Loaded after global.css + css3.css.
   ===================================================================== */
@import url(https://fonts.googleapis.com/css2?family=League+Gothic&display=swap);

:root {
	--c-page: #000000;
	--c-frame: #131313;
	--c-block: #1a1a1a;
	--c-panel: #202020;
	--c-line: #000000;
	--c-edge: #404040;
	--c-text: #c0c0c0;
	--c-muted: #8e8e8e;
	--c-white: #ffffff;
	--c-blue-hi: #0a56b0;
	--c-blue: #014a9d;
	--c-blue-mid: #013a7c;
	--c-blue-lo: #012d5f;
	--c-blue-line: #05468f;
	--c-glow: #1e90ff;
	--c-font: Tahoma, Calibri, Verdana, Geneva, sans-serif;
	--c-gothic: 'League Gothic', 'Arial Narrow', Arial, sans-serif;
	/* the classic vB4 blue bar: light top edge, blue body, dark foot */
	--g-blue: linear-gradient(var(--c-blue-hi) 0, var(--c-blue) 1px, var(--c-blue-mid) 75%, #022a57 100%);
	--g-row1: linear-gradient(#2e2e2e 0, #1d1d1d 22px, #181818 45px, #161616 100%);
	--g-row2: linear-gradient(#2a2a2a 0, #191919 22px, #141414 45px, #121212 100%);
}

/* ---------- page + framed container ---------- */
body {
	background: var(--c-page);
	color: var(--c-text);
	font: 13px/1.45 var(--c-font);
}
#container {
	background: var(--c-frame);
	color: var(--c-text);
	max-width: 1180px;
	min-width: 0;                     /* MyBB's global.css forces 990px - that made phones scroll sideways */
	margin: 0 auto;
	border-left: 1px solid var(--c-edge);
	border-right: 1px solid var(--c-edge);
	box-shadow: 0 0 0 1px #000, 0 0 40px rgba(5, 70, 143, 0.35);
}
.wrapper { width: auto; max-width: none; min-width: 0; margin: 0; padding: 0 18px; }

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

/* ---------- header: slim top bar, blue banner, tab bar ---------- */
#header { display: flex; flex-direction: column; background: transparent; }

/* top bar (search + welcome / login) */
#panel { order: -1; }
#panel .upper {
	background: linear-gradient(#2d2d2d, #272727 50%, #212121);
	border: 0; border-bottom: 1px solid var(--c-line);
	box-shadow: inset 0 1px 0 #3a3a3a;
	color: var(--c-text);
	padding: 5px 0;
	font-size: 12px;
}
#panel .upper .wrapper { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
#panel .upper a:link, #panel .upper a:visited { color: var(--c-white); }
#panel .upper .welcome { color: var(--c-text); }
#panel .upper a.login, #panel .upper a.register {
	display: inline-block; margin-left: 4px; padding: 3px 11px;
	background: var(--g-blue); border: 1px solid #000; border-radius: 3px;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.15);
	color: #fff !important; font-weight: bold; text-decoration: none;
}
#panel .upper a.login:hover, #panel .upper a.register:hover { filter: brightness(1.2); }
#search { margin: 0; }
#search input.textbox, #panel input.textbox {
	background: linear-gradient(#0a0a0a, #151515); border: 1px solid #000; box-shadow: 0 1px 0 #3a3a3a;
	color: #ddd; border-radius: 3px; padding: 3px 6px;
}
#search input.button, #panel input.button {
	background: linear-gradient(#3e3e3e, #252525); border: 1px solid #000; color: #fff; border-radius: 3px; padding: 3px 9px;
}

/* banner: blue header gradient over the San Andreas skyline, inner shadow like the old header */
#logo {
	background:
		linear-gradient(rgba(8, 73, 146, 0.55), rgba(1, 45, 95, 0.85)),
		#012d5f url(../../../images/metrova_banner.jpg) center center / cover no-repeat;
	border-top: 1px solid #555555;
	border-bottom: 0;
	padding: 0;
	box-shadow: inset 0 0 12px #000;
}
#logo .wrapper { display: flex; flex-wrap: wrap; align-items: center; position: relative; min-height: 150px; }
#logo .wrapper > a { display: inline-block; margin: 14px 0; }
#logo .wrapper > a img { height: 120px; max-height: none; width: auto; filter: drop-shadow(0 3px 8px rgba(0,0,0,0.9)); }
#logo .wrapper::after {
	content: "SERVER IP\A mg-gaming.net:7777";
	white-space: pre; text-align: center;
	position: absolute; right: 18px; top: 50%; transform: translateY(calc(-50% - 18px));
	padding: 8px 18px; border-radius: 5px;
	background: rgba(0, 0, 0, 0.6); border: 1px solid var(--c-blue-line);
	box-shadow: 0 0 16px rgba(30, 144, 255, 0.3), inset 0 1px 0 rgba(255,255,255,0.08);
	color: #fff; font: 25px/1.05 var(--c-gothic); letter-spacing: .6px;
}

/* tab bar under the banner */
#logo ul.top_links {
	order: 2; flex-basis: 100%; float: none;
	margin: 0 -18px; padding: 0 18px;            /* bar spans the whole frame, tabs line up with the content */
	background: linear-gradient(#0b0b0b, #080808 60%, #000);
	border-top: 1px solid #000; border-bottom: 1px solid var(--c-blue-line);
	display: flex; flex-wrap: wrap; gap: 2px;
}
#logo ul.top_links li { margin: 0; padding: 0; display: flex; }
#logo ul.top_links a {
	display: flex; align-items: center; height: 34px; box-sizing: border-box;
	padding: 0 16px !important; background-image: none !important;      /* !important: MyBB adds icon padding per link */
	font: bold 12px/1 var(--c-font); color: #ffffff !important;
	border-radius: 5px 5px 0 0; margin-top: 4px; height: 30px;
}
#logo ul.top_links a:hover { background: linear-gradient(#000, #013d81 50%, #000) !important; text-decoration: none; }
#logo ul.top_links li:first-child a {
	background: var(--g-blue) !important;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.18);
}

/* ---------- breadcrumb ---------- */
.navigation {
	background: var(--c-block); border: 1px solid #000; border-radius: 5px;
	box-shadow: inset 0 1px 0 #2a2a2a;
	color: var(--c-muted); padding: 8px 12px; margin: 14px 0;
}
.navigation a:link, .navigation a:visited { color: var(--c-white); }
.navigation .active { color: var(--c-white); font-size: 13px; font-weight: bold; }

/* ---------- blocks / forum tables ---------- */
#content { background: transparent; color: var(--c-text); padding: 0 0 18px 0; }
.tborder {
	background: var(--c-block); border: 1px solid #000;
	border-radius: 7px 7px 0 0; padding: 0; overflow: hidden; margin-bottom: 16px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.6);
}
.thead {
	background: var(--g-blue);
	border-top: 1px solid var(--c-blue-line); border-bottom: 1px solid #000;
	color: var(--c-white); padding: 8px 12px;
	text-shadow: 0 1px 1px #000;
}
.thead strong, .thead a:link, .thead a:visited { color: var(--c-white); font: bold 14px/1.2 var(--c-font); }
.thead .smalltext { color: #c7d7ee; }
.tcat {
	background: var(--c-frame); color: #cccccc;
	border-top: 1px solid #262626; border-bottom: 1px solid #000;
	font-size: 11px; padding: 5px 12px;
}
.tcat a:link, .tcat a:visited { color: #ffffff; }
.trow1, .trow2, .trow_shaded, .trow_selected {
	background: #161616 var(--g-row1) repeat-x;
	color: var(--c-text);
	border-color: #333 #000 #000 #000;      /* top right bottom left */
}
.trow2 { background: #121212 var(--g-row2) repeat-x; }
.trow_shaded { background: #2a1d0a; }
.tborder td, .tborder th { border-left-color: #000; border-right-color: #000; }
.trow1 strong a, .trow2 strong a { font-size: 13px; font-weight: bold; color: var(--c-white); }
.trow1 .smalltext, .trow2 .smalltext, .smalltext { color: var(--c-muted); }
.trow1 .smalltext a, .trow2 .smalltext a { color: #dddddd; }
.tfoot { background: linear-gradient(#000, #212121 50%, #000); border-top: 1px solid #000; color: var(--c-muted); }
.tfoot a:link, .tfoot a:visited { color: #ffffff; }
.trow_sep { background: #000; color: #fff; }
.expcolimage img { filter: invert(1) brightness(1.3); opacity: .85; }

/* sub-forum list under a forum */
.subforumicon { opacity: .8; }

/* ---------- posts (classic layout: user info on the left) ---------- */
.post { background: var(--c-block); border: 1px solid #000; border-radius: 7px 7px 0 0; overflow: hidden; margin-bottom: 14px; }
.post .post_head {
	background: var(--g-blue); border-bottom: 1px solid #000; color: #fff; padding: 6px 10px;
	text-shadow: 0 1px 1px #000;
}
.post .post_head a:link, .post .post_head a:visited { color: #fff; }
#posts .post .post_head span.post_date, .post .post_head span.post_date { color: #dfe9f7; }
.post .post_author { background: var(--c-panel); border-bottom: 1px solid #000; }
.post.classic .post_author { background: var(--c-panel); border: 0; border-right: 1px solid #000; }
.post .post_author strong a, .post .post_author .largetext a { color: #fff; }
.post_author .author_statistics { color: var(--c-muted); }
.post .post_body { color: var(--c-text); }
.post .post_controls, .post.classic .post_controls {
	background: linear-gradient(#000, #212121 50%, #000); border-top: 1px solid #000;
}
.post .signature { border-top: 1px dotted #333; color: #aaa; }
blockquote { background: var(--c-panel); border: 1px solid #000; border-left: 3px solid var(--c-blue-line); color: #bbbbbb; }
blockquote cite { border-bottom: 1px solid #000; color: #ffffff; }
.codeblock { background: #0b0b0b; border: 1px solid #000; color: #cfcfcf; }
.codeblock .title { border-bottom: 1px solid #222; color: #fff; }

/* ---------- forms, buttons, popups, pagination ---------- */
input.textbox, textarea, select {
	background: linear-gradient(#0a0a0a, #151515); border: 1px solid #000; color: #dddddd; border-radius: 3px;
}
button, input.button, a.button:link, a.button:visited {
	background: linear-gradient(#3e3e3e, #252525); border: 1px solid #000; color: #ffffff; border-radius: 3px;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}
a.button:hover, input.button:hover, button:hover { background: var(--g-blue); color: #fff; text-decoration: none; }
.popup_menu, .modal { background: var(--c-block); border: 1px solid #000; color: var(--c-text); box-shadow: 0 4px 18px #000; }
.popup_menu .popup_item { background: var(--c-block); color: #ddd; }
.popup_menu .popup_item:hover { background: var(--c-blue-mid); color: #fff; }
.pagination a, .pagination .pagination_current { background: linear-gradient(#2e2e2e, #181818); border: 1px solid #000; color: #fff; border-radius: 3px; }
.pagination .pagination_current { background: var(--g-blue); }
.pagination a:hover { background: var(--c-blue-mid); text-decoration: none; }

/* ---------- footer ---------- */
#footer .upper { background: linear-gradient(#000, #212121 50%, #000); border-top: 1px solid var(--c-blue-line); border-bottom: 1px solid #000; }
#footer .upper a:link, #footer .upper a:visited { color: #ffffff; }
#footer .lower { background: #0b0b0b; color: var(--c-muted); }
#footer .lower a:link, #footer .lower a:visited { color: #cccccc; }
.forum_legend dd { color: var(--c-muted); }

/* ---------- forum status icons (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.3), rgba(0,0,0,0.3)) 7px 7px / 18px 2px no-repeat,
		linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)) 7px 12px / 13px 2px no-repeat,
		linear-gradient(#d0d0d0, #6e6e6e);
	box-shadow: 0 1px 3px #000, inset 0 1px 0 rgba(255,255,255,0.6);
}
.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: #6e6e6e transparent transparent transparent;
}
.forum_status.forum_on::before {
	background:
		linear-gradient(rgba(255,255,255,0.6), rgba(255,255,255,0.6)) 7px 7px / 18px 2px no-repeat,
		linear-gradient(rgba(255,255,255,0.6), rgba(255,255,255,0.6)) 7px 12px / 13px 2px no-repeat,
		linear-gradient(#6fb4ff, #0a4fa0);
	box-shadow: 0 0 8px rgba(30,144,255,0.55), inset 0 1px 0 rgba(255,255,255,0.6);
}
.forum_status.forum_on::after { border-top-color: #0a4fa0; }
.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;
}
.forum_status.forum_offlink::before { background: linear-gradient(#d0d0d0, #6e6e6e); z-index: -1; }
.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_legend .forum_status { transform: scale(0.6); transform-origin: left center; margin-right: -14px; }

/* ---------- special forum title colours - same as Metrova Dark ---------- */
:root {
	--fc-executive:   #B2B2B2;
	--fc-legislative: #B2B2B2;
	--fc-judicial:    #99CCCC;
	--fc-lspd:        #0000FF;
	--fc-fdsa:        #FF0000;
	--fc-saas:        #8BB82D;
	--fc-sanews:      #FF9A1F;
	--fc-dga:         #FF3300;
}
a[href$="forumdisplay.php?fid=67"] { color: #00ffff !important; }
a[href$="forumdisplay.php?fid=68"] { color: #ff1493 !important; }
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; }

/* ---------- notices ---------- */
.red_alert { background: #3a0b0b; border: 1px solid #7a1a1a; color: #ffb3b3; }
.pm_alert { background: #071a33; border: 1px solid var(--c-blue-line); color: #cfe4ff; }

/* ---------- phones ---------- */
@media (max-width: 760px) {
	.wrapper { padding: 0 10px; }
	#logo ul.top_links { margin: 0 -10px; padding: 0 10px; }
	#logo .wrapper > a img { height: 84px; }
	#logo .wrapper::after { position: static; transform: none; display: block; order: 1; margin: 0 0 12px 0; font-size: 19px; }
	#logo ul.top_links a { padding: 0 10px !important; }
	/* forum lists: hide the Threads / Posts columns, keep forum + last post */
	.tborder td[width="85"], .tborder td.trow1[align="center"][style*="nowrap"], .tborder td.trow2[align="center"][style*="nowrap"] { display: none; }
	.tborder td[width="200"] { width: auto; }
	.post.classic .post_author { float: none; width: auto; border-right: 0; border-bottom: 1px solid #000; }
	.post.classic .post_content { float: none; width: auto; }
}
