/* Section styles for custom template. Modules only provide semantic classes. */
.module-page {
	margin: 0;
	padding: 0;
}

.module-title {
	margin: 0 0 16px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--border);
	text-align: left;
	color: #fff;
}

.module-text {
	margin: 8px 0 16px;
	color: var(--muted);
	line-height: 1.6;
}

.module-note {
	margin: 14px 0 0;
	color: var(--muted);
	text-align: center;
	font-size: 12px;
}

.module-form {
	margin: 18px 0;
}

.ui-form-wrap {
	margin: 18px 0;
}

.ui-table {
	width: 100%;
	border-collapse: collapse;
	background: rgba(13, 20, 33, .68);
	border: 1px solid var(--border);
	border-radius: 8px;
	overflow: hidden;
}

.ui-table + .ui-table {
	margin-top: 18px;
}

.ui-table td {
	padding: 10px 12px;
	border: 1px solid var(--border);
	vertical-align: middle;
}

.ui-table .ui-header,
.ui-table .header {
	background: var(--surface-2);
	color: #fff;
	text-align: center;
	font-weight: 700;
}

.ui-label {
	width: 35%;
	font-weight: 700;
}

.ui-label-wide {
	width: 40%;
	font-weight: 700;
}

.ui-label-half {
	width: 50%;
	font-weight: 700;
}

.ui-center {
	text-align: center;
}

.ui-input,
.ui-select {
	width: 100%;
}

.ui-actions {
	margin: 12px 0 0;
}

.ui-button {
	width: 100%;
}

.newButton {
	min-height: 36px;
	padding: 8px 13px;
	border: 1px solid var(--accent);
	border-radius: 8px;
	background: var(--accent);
	color: #07111f;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.newButton:hover {
	background: #8cc5ff;
}

.page-about .module-text,
.page-rules .module-text,
.page-download .module-text {
	text-align: left;
}

.page-register .module-form,
.page-recover .module-form,
.page-account .module-form,
.page-admin .module-form {
	max-width: 100%;
}

.page-top .ui-table,
.page-guilds .ui-table,
.page-statistics .ui-table {
	font-size: 13px;
}

.page-char .ui-table,
.page-guild .ui-table,
.page-account .ui-table {
	margin-bottom: 16px;
}

.login-server {
	clear: both;
	padding: 4px 0 8px;
}

.login-server-select,
.server-select {
	width: 100%;
}

.module-server-switch {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
	padding: 10px 12px;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: rgba(13, 20, 33, .68);
}

.module-server-switch span {
	margin-right: 4px;
	color: var(--muted);
	font-weight: 700;
}

.module-server-switch form {
	margin: 0;
}

.server-switch-button {
	min-height: 32px;
	padding: 6px 12px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: rgba(255, 255, 255, .055);
	color: var(--text);
	font: inherit;
	cursor: pointer;
}

.server-switch-button:hover,
.server-switch-button.active {
	border-color: var(--accent);
	background: var(--accent);
	color: #07111f;
}

.news-item {
	padding: 16px 0;
	border-bottom: 1px solid var(--border);
}

.news-item:first-of-type {
	padding-top: 0;
}

.news-item:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.news-item h3 {
	margin: 0 0 8px;
	font-size: 17px;
}

.news-body {
	text-align: left;
}

.module-news .module-note {
	margin: 0 0 10px;
	text-align: left;
}