/* Arkhon Online look for MyBB: black, dark bronze, gold, classic board tables.
   Loaded after MyBB's own stylesheets (mybb/setup.php attaches it to the default theme).
   Fonts are served from the forum itself (no third-party font requests). */

@font-face {
	font-family: "Cinzel";
	src: url(../../../images/arkhon/cinzel-latin.woff2) format("woff2");
	font-weight: 400 900;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212;
}

@font-face {
	font-family: "Cinzel";
	src: url(../../../images/arkhon/cinzel-latin-ext.woff2) format("woff2");
	font-weight: 400 900;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+20A0-20AB, U+20AD-20C4, U+A720-A7FF;
}

:root {
	--ak-bg: #060507;
	--ak-panel: #100c0b;
	--ak-row1: #14100d;
	--ak-row2: #1a1410;
	--ak-rule: rgba(125, 87, 48, 0.4);
	--ak-bronze: #7d5730;
	--ak-bronze-dark: #4a321a;
	--ak-bronze-light: #a9783f;
	--ak-gold: #d4ae4c;
	--ak-gold-bright: #f1d68b;
	--ak-text: #e8dcc4;
	--ak-muted: #a99d89;
	--ak-danger: #e0715f;
	--ak-heading: "Cinzel", Georgia, serif;
	--ak-body: "Segoe UI", Tahoma, Verdana, Arial, sans-serif;
}

/* ---------- Page ---------- */
body {
	background-color: var(--ak-bg);
	background-image:
		radial-gradient(ellipse 80% 50% at 50% -10%, rgba(125, 87, 48, 0.22), transparent 70%),
		radial-gradient(ellipse 60% 40% at 85% 110%, rgba(120, 40, 20, 0.12), transparent 70%);
	background-attachment: fixed;
	color: var(--ak-text);
	font-family: var(--ak-body);
	font-size: 14px;
}

#container,
table {
	color: var(--ak-text);
	font-family: var(--ak-body);
	font-size: 14px;
}

a:link,
a:visited {
	color: var(--ak-gold);
}

a:hover,
a:active {
	color: var(--ak-gold-bright);
	text-decoration: none;
}

.smalltext,
.post_date,
.author_statistics {
	color: var(--ak-muted);
}

hr {
	border-color: var(--ak-rule);
}

/* ---------- Header ---------- */
#logo {
	background: linear-gradient(180deg, #060507, #100b0a);
	border-bottom: 1px solid var(--ak-bronze-dark);
	box-shadow: 0 1px 0 rgba(212, 174, 76, 0.12), 0 8px 24px rgba(0, 0, 0, 0.6);
	padding: 12px 0;
}

#logo .wrapper > a {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}

#logo .wrapper > a img {
	height: 56px;
	width: auto;
	filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.7)) drop-shadow(0 0 10px rgba(212, 174, 76, 0.25));
}

/* ARKHON / ONLINE wordmark next to the crest, like the website header. */
#logo .wrapper > a::after {
	content: "ARKHON\A ONLINE";
	white-space: pre;
	font-family: var(--ak-heading);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.05;
	letter-spacing: 0.16em;
	background: linear-gradient(180deg, #fff1c4 0%, var(--ak-gold-bright) 22%, var(--ak-gold) 52%, #9a6d28 78%, #e8c873 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

#logo ul.top_links {
	margin-top: -38px;
}

/* Discord / YouTube buttons in the middle of the header (Arkhon plugin) */
#logo .wrapper {
	position: relative;
}

.arkhon-social-links {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	gap: 12px;
}

#logo .arkhon-social-links a.arkhon-social {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 16px 7px 12px;
	border: 1px solid var(--ak-bronze);
	border-radius: 3px;
	background: linear-gradient(180deg, #2a1f17, #120d0a);
	color: var(--ak-gold-bright);
	font-family: var(--ak-heading);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-decoration: none;
	box-shadow: inset 0 1px 0 rgba(255, 240, 200, 0.12), 0 2px 8px rgba(0, 0, 0, 0.5);
	transition: border-color 0.15s, box-shadow 0.15s, color 0.15s;
}

#logo .arkhon-social-links a.arkhon-social::after {
	content: none;
}

#logo .arkhon-social-links a.arkhon-social:hover {
	border-color: var(--ak-gold);
	color: #fff3cf;
}

.arkhon-social-discord svg {
	color: #8c9eff;
}

.arkhon-social-discord:hover {
	box-shadow: 0 0 14px rgba(114, 137, 218, 0.45);
}

.arkhon-social-youtube svg {
	color: #ff3b30;
}

.arkhon-social-youtube:hover {
	box-shadow: 0 0 14px rgba(255, 59, 48, 0.45);
}

@media (max-width: 1100px) {
	.arkhon-social-links {
		position: static;
		transform: none;
		justify-content: center;
		margin-top: 10px;
	}
}

/* Latest threads box on the board index (Arkhon plugin) */
.arkhon-latest .arkhon-latest-subject {
	font-weight: 700;
	color: var(--ak-gold-bright);
}

.arkhon-latest .arkhon-latest-author {
	width: 16%;
	text-align: center;
}

.arkhon-latest .arkhon-latest-count {
	width: 8%;
	text-align: center;
}

.arkhon-latest .arkhon-latest-date {
	width: 14%;
	text-align: center;
}

#header ul.menu li a {
	font-family: var(--ak-heading);
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ak-gold-bright);
	filter: sepia(1) saturate(1.5) hue-rotate(-10deg);
}

#panel .upper {
	background: linear-gradient(180deg, #2a1c0e, #160f09);
	border-top: 1px solid var(--ak-bronze);
	border-bottom: 1px solid #000;
	color: var(--ak-text);
}

#panel .upper a:link,
#panel .upper a:visited,
#panel .upper a:hover,
#panel .upper a:active {
	color: var(--ak-gold-bright);
}

#panel .lower {
	background: #0d0a09;
	border-top: 1px solid rgba(212, 174, 76, 0.1);
	border-bottom: 1px solid var(--ak-bronze-dark);
	color: var(--ak-muted);
}

#panel .lower a:link,
#panel .lower a:visited,
#panel .lower a:hover,
#panel .lower a:active {
	color: var(--ak-gold);
}

#content {
	background: transparent;
}

/* TR | EN switch (Arkhon plugin) */
.arkhon-lang-switch {
	float: right;
	display: inline-flex;
	margin: -2px 0 0 12px;
	border: 1px solid var(--ak-bronze-dark);
	border-radius: 2px;
	overflow: hidden;
	background: #0a0809;
}

.arkhon-lang-switch .arkhon-lang:link,
.arkhon-lang-switch .arkhon-lang:visited {
	padding: 3px 9px;
	color: var(--ak-muted);
	font-family: var(--ak-heading);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
}

.arkhon-lang-switch .arkhon-lang + .arkhon-lang {
	border-left: 1px solid var(--ak-bronze-dark);
}

.arkhon-lang-switch .arkhon-lang.active,
#panel .upper .arkhon-lang-switch a.arkhon-lang.active:link,
#panel .upper .arkhon-lang-switch a.arkhon-lang.active:visited {
	color: #1c0f02;
	background: linear-gradient(180deg, #f1d483, #c8973e);
}

#panel .upper .arkhon-lang-switch a.arkhon-lang:link,
#panel .upper .arkhon-lang-switch a.arkhon-lang:visited {
	color: var(--ak-muted);
}

/* Quick search in the header */
#search input.textbox {
	border-color: var(--ak-bronze-dark);
}

#search input.button {
	background: linear-gradient(180deg, #f1d483 0%, #d4a648 40%, #a87628 75%, #c8973e 100%);
	border: 1px solid #8f6322;
	color: #2a1806;
	font-weight: 700;
}

/* ---------- Navigation ---------- */
.navigation {
	color: var(--ak-muted);
	padding: 4px 0 8px;
}

.navigation .active {
	color: var(--ak-gold-bright);
}

/* ---------- Tables (board index, forum and thread lists) ---------- */
.tborder {
	background: var(--ak-panel);
	border: 1px solid var(--ak-bronze);
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
	padding: 0;
	border-radius: 0;
}

.thead {
	background: linear-gradient(180deg, #5c3f20 0%, #3b2814 55%, #281b0d 100%);
	border-bottom: 1px solid var(--ak-gold);
	color: var(--ak-gold-bright);
	padding: 9px 12px;
	border-radius: 0 !important;
}

.thead,
.thead a:link,
.thead a:visited,
.thead a:hover,
.thead a:active {
	color: var(--ak-gold-bright);
}

/* Section titles hold Turkish and English names side by side; in Cinzel the page language would
   change the other language's letters (e.g. "i" -> "İ"), so they keep the body font. */
.thead strong,
.thead > div > strong {
	font-size: 14px;
	letter-spacing: 0.05em;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6);
}

.tcat {
	background: #1f160e;
	border-top: 1px solid rgba(212, 174, 76, 0.15);
	border-bottom: 1px solid var(--ak-rule);
	color: var(--ak-bronze-light);
	font-family: var(--ak-heading);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 6px 12px;
}

.tcat a:link,
.tcat a:visited {
	color: var(--ak-bronze-light);
}

.trow1,
.trow2,
.trow_shaded,
.trow_deleted {
	border-color: var(--ak-rule);
	color: var(--ak-text);
}

.trow1 {
	background: var(--ak-row1);
}

.trow2 {
	background: var(--ak-row2);
}

.trow_shaded {
	background: #2a1610;
}

.trow_selected,
tr.trow_selected td {
	background: #2b2010;
	color: var(--ak-text);
}

.trow_sep {
	background: #1f160e;
	color: var(--ak-bronze-light);
	border-bottom: 1px solid var(--ak-rule);
}

.tborder tbody tr:last-child > td {
	border-bottom: 0;
}

.tfoot {
	background: #120d0a;
	border-top: 1px solid var(--ak-rule);
	color: var(--ak-muted);
}

.tfoot a:link,
.tfoot a:visited {
	color: var(--ak-gold);
}

/* Forum names in the board index */
.trow1 strong a:link,
.trow1 strong a:visited,
.trow2 strong a:link,
.trow2 strong a:visited,
.subject_new a,
.subject_old a {
	color: var(--ak-gold-bright);
	font-weight: 700;
}

.subject_new a:link,
.subject_new a:visited {
	color: #fff1c4;
}

/* Forum status icon: the crest, dimmed when there is nothing new. */
.forum_status {
	background: url(../../../images/arkhon/emblem.svg) center / contain no-repeat;
	filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.7));
}

.forum_off,
.forum_offclose {
	opacity: 0.45;
	filter: grayscale(0.6);
}

.forum_offlink {
	opacity: 0.6;
}

/* ---------- Posts (classic: author box on the left) ---------- */
.post {
	background: var(--ak-row1);
	border: 1px solid var(--ak-rule);
	margin-bottom: 12px;
	overflow: hidden;
}

.post .post_author,
.post.classic .post_author {
	background: linear-gradient(180deg, rgba(60, 40, 20, 0.45), rgba(20, 14, 10, 0.3));
	border-bottom: 1px solid var(--ak-rule);
	color: var(--ak-muted);
}

.post.classic .post_author {
	border-right: 1px solid var(--ak-rule);
	border-bottom: 0;
	text-align: center;
}

.post.classic .post_author div.author_avatar {
	float: none;
	margin: 6px auto 8px;
}

.post.classic .post_author div.author_information,
.post.classic .post_author div.author_statistics {
	float: none;
	text-align: center;
	border-top: 1px dotted var(--ak-rule);
	padding-top: 6px;
	margin-top: 6px;
}

.post .post_author .largetext a:link,
.post .post_author .largetext a:visited {
	color: var(--ak-gold-bright);
	font-weight: 700;
}

/* Staff names (MyBB group name styles set by mybb/setup.php) */
.ak-name {
	font-weight: 700;
}

.ak-name-admin {
	color: #ff3b30;
	text-shadow: 0 0 6px rgba(255, 40, 30, 0.55), 0 1px 0 #000;
}

.ak-name-supermod,
.ak-name-mod {
	color: #ffd23f;
	text-shadow: 0 0 6px rgba(255, 200, 40, 0.45), 0 1px 0 #000;
}

.ak-name-member {
	color: #4cd964;
	text-shadow: 0 1px 0 #000;
}

.ak-name-guest {
	color: #9a9a9a;
	text-shadow: 0 1px 0 #000;
}

/* Name colour legend under who's online (index) */
.arkhon-legend {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 16px;
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid rgba(125, 87, 48, 0.3);
}

.arkhon-legend-title {
	color: var(--ak-text-muted, #a99d89);
}

.arkhon-legend-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.arkhon-legend-dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: currentColor;
	box-shadow: 0 0 6px currentColor;
}

/* Rank plate under the name */
.post_author img[src*="images/arkhon/rank-"],
.profile img[src*="images/arkhon/rank-"] {
	margin: 4px auto 2px;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.7));
}

.post .post_author .author_avatar img {
	border: 1px solid var(--ak-bronze);
	background: #0a0809;
	padding: 3px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

.post .post_head {
	border-bottom: 1px solid var(--ak-rule);
	color: var(--ak-muted);
}

.post .post_head span.post_date {
	color: var(--ak-muted);
}

.post_body {
	color: var(--ak-text);
	line-height: 1.6;
}

.signature {
	border-top: 1px dashed var(--ak-rule);
	color: var(--ak-muted);
}

.post .post_meta,
.post_controls {
	background: #120d0a;
	border-top: 1px solid var(--ak-rule);
	color: var(--ak-muted);
}

.post.unapproved_post,
.post.unapproved_post .post_author,
.post.deleted_post .post_author {
	background: #24120d;
}

blockquote {
	background: #0d0a09;
	border: 1px solid var(--ak-rule);
	border-left: 3px solid var(--ak-gold);
	color: var(--ak-text);
}

blockquote cite {
	border-bottom: 1px solid var(--ak-rule);
	color: var(--ak-gold);
}

.codeblock {
	background: #0a0809;
	border: 1px solid var(--ak-rule);
	color: var(--ak-text);
}

.codeblock .title {
	border-bottom: 1px solid var(--ak-rule);
	color: var(--ak-gold);
}

/* Clan (user title), team chip and badge medallions (Arkhon plugin) */
.post .post_author .smalltext,
.author_information .smalltext {
	color: var(--ak-gold);
}

/* Rank plate above the avatar in classic posts */
.arkhon-rank-top {
	text-align: center;
	line-height: 0;
	margin: 2px 0 6px;
}

.arkhon-rank-top br {
	display: none;
}

/* Profile page: extras sit left-aligned under the stars */
.arkhon-profile-extras .arkhon-identity,
.arkhon-profile-extras .arkhon-extras {
	justify-content: flex-start;
}

/* User CP > Edit Profile: race and class picker */
.arkhon-identity-picker .arkhon-pick-group {
	margin: 8px 0 12px;
}

.arkhon-pick-title {
	display: block;
	margin-bottom: 6px;
	color: var(--ak-bronze-light);
	font-family: var(--ak-heading);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.arkhon-pick-options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.arkhon-pick {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 8px;
	border: 1px solid var(--ak-bronze-dark);
	border-radius: 3px;
	cursor: pointer;
}

.arkhon-pick:has(input:checked) {
	border-color: var(--ak-gold);
	background: rgba(212, 174, 76, 0.1);
}

.arkhon-pick .arkhon-identity {
	margin: 0;
}

/* Race shield + class medallion with names */
.arkhon-identity {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin: 6px 0 2px;
}

.arkhon-race,
.arkhon-class {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 2px 8px 2px 4px;
	border: 1px solid var(--ak-bronze-dark);
	border-radius: 3px;
	background: linear-gradient(180deg, #2a1f17, #120d0a);
	color: var(--ak-gold-bright);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
}

.arkhon-race svg,
.arkhon-class svg {
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.7));
}

.arkhon-extras {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 5px;
	margin: 6px 0 2px;
}

/* Club ribbon: full name in club colours, striped edge on the left, notched tail on the right */
.arkhon-team {
	display: inline-flex;
	align-items: center;
	padding: 3px 16px 3px 16px;
	background:
		linear-gradient(90deg, var(--team-fg) 0 3px, transparent 3px 5px, var(--team-fg) 5px 7px, transparent 7px),
		linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(0, 0, 0, 0.25)),
		var(--team-bg);
	color: var(--team-fg);
	font: 700 11.5px/1.4 var(--ak-body);
	letter-spacing: 0.05em;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
	clip-path: polygon(0 0, 100% 0, calc(100% - 7px) 50%, 100% 100%, 0 100%);
	box-shadow: inset 0 0 0 1px var(--team-fg);
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
	white-space: nowrap;
}

/* Badge medallions right after the poster's name and online dot */
.post_author .author_information .arkhon-badges {
	margin-left: 4px;
	vertical-align: middle;
}

.arkhon-badges {
	display: inline-flex;
	gap: 3px;
}

.arkhon-badge {
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.7));
}

/* ---------- Buttons and forms ---------- */
.button,
input.button,
button,
a.button:link,
a.button:visited,
.postbit_buttons > a:link,
.postbit_buttons > a:visited {
	background: linear-gradient(180deg, #2a1f17, #120d0a);
	border: 1px solid var(--ak-bronze);
	border-radius: 2px;
	color: var(--ak-gold-bright);
	text-shadow: none;
	box-shadow: none;
}

.button:hover,
input.button:hover,
button:hover,
a.button:hover,
.postbit_buttons > a:hover {
	border-color: var(--ak-gold);
	color: #fff3cf;
	box-shadow: 0 0 10px rgba(212, 174, 76, 0.3);
}

/* Main actions (new thread, reply, submit) in gold */
a.button.new_thread_button,
a.button.new_reply_button,
input.button[type="submit"],
button[type="submit"] {
	background: linear-gradient(180deg, #f1d483 0%, #d4a648 40%, #a87628 75%, #c8973e 100%);
	border: 1px solid #8f6322;
	color: #2a1806;
	font-weight: 700;
	text-shadow: 0 1px 0 rgba(255, 236, 180, 0.5);
}

a.button.new_thread_button:hover,
a.button.new_reply_button:hover,
input.button[type="submit"]:hover,
button[type="submit"]:hover {
	color: #1c0f02;
	box-shadow: 0 0 14px rgba(241, 214, 139, 0.45);
}

input.textbox,
textarea,
select,
.select2-container .select2-choice {
	background: #0a0809;
	border: 1px solid var(--ak-bronze-dark);
	color: var(--ak-text);
	border-radius: 2px;
}

input.textbox:focus,
textarea:focus,
select:focus {
	border-color: var(--ak-gold);
	outline: none;
	box-shadow: 0 0 0 3px rgba(212, 174, 76, 0.15);
}

/* Editor */
.sceditor-container,
.sceditor-container iframe,
.sceditor-container textarea {
	background: #0a0809 !important;
	color: var(--ak-text) !important;
	border-color: var(--ak-bronze-dark) !important;
}

.sceditor-toolbar {
	background: #1f160e !important;
	border-bottom: 1px solid var(--ak-rule) !important;
}

/* ---------- Pagination, popups, notices ---------- */
.pagination a,
.pagination .pagination_current {
	background: #120d0a;
	border: 1px solid var(--ak-bronze-dark);
	color: var(--ak-gold);
}

.pagination .pagination_current,
.pagination a:hover {
	background: linear-gradient(180deg, #f1d483, #c8973e);
	color: #1c0f02;
}

.popup_menu,
.modal {
	background: var(--ak-panel);
	border: 1px solid var(--ak-bronze);
	color: var(--ak-text);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7);
}

.popup_menu .popup_item {
	background: var(--ak-panel);
	color: var(--ak-text);
}

.popup_menu .popup_item:hover {
	background: #2a1f17;
	color: var(--ak-gold-bright);
}

.red_alert,
.pm_alert,
.error {
	background: #2a1610;
	border: 1px solid var(--ak-danger);
	color: #ffd9cf;
}

.pm_alert {
	background: #1f1a0e;
	border-color: var(--ak-gold);
	color: var(--ak-text);
}

/* ---------- Footer ---------- */
#footer .upper {
	background: linear-gradient(180deg, #160f09, #0d0a09);
	border-top: 1px solid var(--ak-bronze-dark);
	border-bottom: 1px solid var(--ak-bronze-dark);
}

#footer .lower,
#footer .lower #current_time {
	color: var(--ak-muted);
}

#footer a:link,
#footer a:visited,
#footer .lower a:link,
#footer .lower a:visited {
	color: var(--ak-gold);
}

#footer .upper .language select,
#footer .upper .theme select {
	border-color: var(--ak-bronze-dark);
}

/* Pictures inside posts: never wider than the post, soft gold frame. */
.post_body img:not([src*="smilies"]) {
  max-width: 100%;
  height: auto;
  border: 1px solid rgba(224, 180, 76, 0.35);
  border-radius: 6px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.55);
}

/* Searched words: in the search results (search-highlight.js) and inside posts (MyBB's ?highlight=). */
mark.arkhon-hl,
.post_body span.highlight {
	padding: 0 2px;
	border-radius: 2px;
	background: #ffd23f;
	color: #1a1205;
	font-weight: 700;
}

/* ---------- Phones and small tablets ----------
   The viewport meta (headerinclude, added by the plugin) makes phones render at their own width.
   MyBB's layout is table based, so on narrow screens the less important columns are hidden and
   the post author box sits above the post instead of beside it. */
@media (max-width: 760px) {
	body,
	#container,
	table {
		font-size: 16px;
		-webkit-text-size-adjust: 100%;
	}

	.smalltext,
	.post_date,
	.post .post_author div.author_statistics {
		font-size: 13px;
	}

	#container {
		min-width: 0;
	}

	.wrapper {
		width: auto;
		min-width: 0;
		max-width: none;
		margin: 0 10px;
	}

	#content {
		padding: 12px 0;
	}

	img {
		max-width: 100%;
		height: auto;
	}

	/* Header: logo, social buttons and menu stacked and centred. */
	#logo .wrapper,
	#logo ul.top_links,
	#header ul.menu {
		text-align: center;
	}

	#logo .wrapper > a {
		display: block;
		float: none;
		text-align: center;
	}

	#logo ul.top_links,
	#header ul.menu {
		float: none;
		margin: 10px 0 0;
		padding: 0;
	}

	#logo ul.top_links li,
	#header ul.menu li {
		display: inline-block;
		margin: 4px 6px;
	}

	#panel .upper .wrapper,
	#panel .lower .wrapper {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 6px 12px;
		text-align: center;
	}

	#panel .upper .float_right,
	#panel .upper .float_left,
	#panel .lower .float_right,
	#panel .lower .float_left,
	#panel .lower ul.panel_links,
	#panel .lower ul.user_links {
		float: none;
		margin: 0;
	}

	#search input.textbox {
		width: 140px;
	}

	/* Board index: hide the thread and post counts; last post stays. */
	.tborder td[width="85"],
	.tborder td[align="center"][style*="nowrap"] {
		display: none;
	}

	/* Latest threads box: author and date hidden. */
	.arkhon-latest .arkhon-latest-author,
	.arkhon-latest .arkhon-latest-date {
		display: none;
	}

	/* Thread lists (forum, search results): rating, author and last post columns hidden. */
	td[id^="rating_table_"],
	.tborder td.tcat[width="80"],
	.tborder td.tcat[width="20%"],
	.tborder tr.inline_row td:last-child,
	.tborder tr.inline_row td[style*="text-align: right"] {
		display: none;
	}

	/* Thread page: author box on top, post below. */
	.post.classic .post_author,
	.post.classic .post_content {
		float: none;
		width: auto;
		margin: 0;
		border-right: 0;
	}

	.post.classic .post_author {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		gap: 6px 12px;
		border-bottom: 1px solid var(--ak-bronze-dark, #4a321a);
	}

	.post .post_author div.author_avatar,
	.post .post_author div.author_information,
	.post .post_author div.author_statistics {
		float: none;
		text-align: center;
	}

	.post .post_author div.author_statistics {
		width: 100%;
		border: 0;
	}

	.post_body {
		padding: 10px 4px;
		font-size: 16px;
		line-height: 1.6;
		overflow-wrap: anywhere;
	}

	.float_right .button,
	.thread_start_datetime {
		margin-top: 6px;
	}

	.arkhon-thread-views {
		padding-right: 8px;
	}

	/* Wide tables that remain (user CP, member list) scroll sideways inside themselves. */
	#content > .wrapper > table.tborder,
	#content table.tborder {
		display: block;
		overflow-x: auto;
	}

	#content table.tborder > thead,
	#content table.tborder > tbody {
		display: table;
		width: 100%;
	}
}