/* Styles for the dynamic pages (accounts, chat, avatars, bugs, dev log),
   carried over from the archived site. index.css stays the homepage sheet. */

.field {
	background-color: #111111;
	color: #cccccc;
	border: 1px solid #333333;
	font-family: Verdana;
	font-size: 11px;
	padding: 2px;
}

.err { color: #cc5544; }

.chatlog {
	background-color: #0a0e18;
	border: 1px solid #1a2236;
	height: 240px;
	overflow-y: auto;
	padding: 8px 10px;
	margin-top: 8px;
	font-family: "Courier New", monospace;
	font-size: 10px;
	line-height: 14px;
}

.chatlog .entry { margin-bottom: 8px; }
.chatlog .ts    { color: #6699aa; }
.chatlog .nm    { color: #ffffff; font-weight: bold; }
.chatlog .msg   { color: #aaaaaa; font-family: Verdana, Arial, sans-serif; font-size: 10px; }

.filter-bar    { background-color: #0a0e18; border: 1px solid #1a2236; padding: 7px 10px; margin-bottom: 10px; }
.filter-label  { font-size: 10px; color: #556677; letter-spacing: 1px; margin-right: 4px; }
.filter-field  { background-color: #0d1220; color: #aaaaaa; border: 1px solid #252f42; font-family: Verdana; font-size: 10px; padding: 2px 5px; }
.filter-select { background-color: #0d1220; color: #aaaaaa; border: 1px solid #252f42; font-family: Verdana; font-size: 10px; padding: 2px; }
.filter-check  { margin-left: 12px; }
.filter-check input { vertical-align: middle; margin: 0 4px 0 0; }
.filter-check label { cursor: pointer; font-size: 10px; color: #556677; letter-spacing: 1px; }

.summary-bar { font-family: "Courier New", monospace; font-size: 10px; color: #334455; letter-spacing: 1px; margin-bottom: 8px; }
.summary-bar span { color: #557799; }

.reg-field { width: 200px; max-width: 100%; box-sizing: border-box; }
.reg-panel { max-width: 260px; flex: 0 0 auto; box-sizing: border-box; }
.registertext { width: 500px; max-width: 100%; }
/* the form beside its explanation; underneath it on a phone */
.reg-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 0 40px; }
.reg-wrap .registertext { flex: 1 1 280px; width: auto; min-width: 0; }   /* a fixed width here would widen the page on a phone */
.reg-code { font-family: "Courier New", monospace; font-size: 18px; letter-spacing: 4px; width: 140px; }
.reg-address { color: #cccccc; overflow-wrap: anywhere; }
.forgot { display: inline-block; margin-top: 2px; }
@media (max-width: 780px) {
	.reg-panel { max-width: none; width: 100%; }
	.reg-field, .reg-panel .btn { font-size: 16px; }   /* below 16px, phones zoom the page when a field is tapped */
	.reg-field { width: 100%; }
	.reg-code { width: 100%; }
}

.av-name a { color: #ccd9e6; font-weight: bold; }
.av-name a:hover { color: #ffffff; }
.av-rank   { font-size: 10px; color: #556677; font-style: italic; }
.av-empire { font-size: 11px; color: #7a8a99; }
.av-flag   { display: block; max-width: 28px; max-height: 18px; border: 1px solid #1a2236; }

.av-identity { background-color: #0a0e18; border: 1px solid #1a2236; padding: 14px 16px; margin: 8px 0px 15px 0px; }
.av-identity-name { font-family: "Trebuchet MS", Arial, sans-serif; font-size: 18px; font-weight: bold; color: #ccd9e6; letter-spacing: 2px; }
.av-identity-sub  { font-size: 10px; color: #556677; letter-spacing: 1px; margin-top: 4px; }
.av-empire-name   { font-size: 11px; color: #7a8a99; margin-top: 6px; }
.av-flag-big      { width: 120px; height: auto; border: 1px solid #1a2236; display: block; }

.info-value.mono { font-family: "Courier New", monospace; font-size: 10px; color: #6699aa; }

.back-link { font-size: 10px; color: #556677; letter-spacing: 1px; }
.back-link a { color: #6699aa; }
.back-link a:hover { color: #ffffff; }

.section-gap { height: 10px; }

/* sidebar dev log list: no gap above the first entry */
.mt-0 { margin-top: 0; }

/* the logged-in account buttons: all the same size, two to a row */
.acct-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.acct-btns .btn { width: 100%; padding-left: 2px; padding-right: 2px; text-align: center; }