/* ==========================================================================
   Knights Mobile - MyBB 1.8 temasi (sitenin renkleri ve yazi tipleri)
   Masaustu ve mobil ayni dil: koyu zemin, altin vurgu, kart gorunumu.
   Kurulum: php _tema\install-theme.php (Default temaya stylesheet olarak)
   ========================================================================== */
@import url(https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;900&display=swap);

:root {
	--ink-950: #050505; --ink-900: #090909; --ink-800: #111111; --ink-700: #171717;
	--ink-warm: #1b1204;
	--gold-200: #fff3b0; --gold-300: #ffe18a; --gold-400: #ffd86b; --gold-500: #f3d675;
	--gold-600: #d6a742; --gold-700: #b77a19;
	--parchment: #e8d18a; --parchment-dim: #cbbe93;
	--line: rgba(214, 167, 66, .18);
	--radius: 14px;
	--sans: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	--display: 'Cinzel', Georgia, serif;
}

/* ---------- zemin ---------- */
html, body {
	background: radial-gradient(1200px 600px at 50% -200px, #2a1c05 0%, var(--ink-950) 60%) fixed, var(--ink-950);
	color: var(--parchment);
	font-family: var(--sans);
	font-size: 15px;
	line-height: 1.55;
}
a, a:link, a:visited { color: var(--gold-400); text-decoration: none; }
a:hover, a:active { color: var(--gold-200); text-decoration: none; }
#container { background: transparent; color: var(--parchment); min-width: 0 !important; width: auto; }
html, body { overflow-x: hidden; }
.wrapper { width: auto; max-width: 1120px; min-width: 0; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }

/* ---------- ust bant ---------- */
#header #logo {
	background: rgba(5, 5, 5, .85);
	border-bottom: 1px solid var(--line);
	padding: 0;
	backdrop-filter: blur(8px);
}
#logo .wrapper { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; flex-wrap: wrap; }
#logo a.km-home {
	font-family: var(--display); font-weight: 900; font-size: 22px; letter-spacing: .04em;
	background: linear-gradient(180deg, var(--gold-200), var(--gold-600));
	-webkit-background-clip: text; background-clip: text; color: transparent;
	padding: 14px 0;
}
#logo a.km-home::before { content: '\2190  '; color: var(--gold-600); -webkit-text-fill-color: var(--gold-600); font-family: var(--sans); font-weight: 400; }
#logo ul.top_links { position: static; margin: 0; padding: 0; display: flex; gap: 6px; flex-wrap: wrap; }
#logo ul.top_links li { margin: 0; padding: 0; }
#logo ul.top_links a {
	display: inline-block; padding: 8px 12px; border-radius: 999px;
	color: var(--parchment-dim); background: none !important; font-weight: 600; font-size: 14px;
}
#logo ul.top_links a:hover { color: var(--gold-200); background: rgba(255, 216, 107, .08) !important; }

#header #panel .upper {
	background: var(--ink-900); border: 0; border-bottom: 1px solid var(--line);
	color: var(--parchment-dim); padding: 10px 0;
}
#panel .upper .wrapper { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
#panel .upper a { color: var(--gold-400); font-weight: 600; }
#panel .upper a.login, #panel .upper a.usercp {
	background: linear-gradient(180deg, var(--gold-400), var(--gold-700)) !important;
	color: var(--ink-warm) !important; padding: 8px 16px !important; border-radius: 999px; font-weight: 800;
}
#panel .upper a.login:hover { filter: brightness(1.08); }
#panel .upper ul.menu.user_links { float: none; margin: 0; }
#search { float: none !important; }
#search input.textbox { min-width: 0; }
#panel .lower { background: transparent; border: 0; color: var(--parchment-dim); }

/* ---------- icerik ---------- */
#content { background: transparent; padding: 28px 0 40px; }
.navigation { color: var(--parchment-dim); font-size: 14px; margin-bottom: 18px; }
.navigation .active { color: var(--parchment); font-family: var(--display); font-size: 20px; font-weight: 700; }

table.tborder {
	background: var(--ink-800); border: 1px solid var(--line); border-radius: var(--radius);
	border-collapse: separate; border-spacing: 0; overflow: hidden; width: 100%;
	box-shadow: 0 20px 50px -30px rgba(0, 0, 0, .9);
	margin-bottom: 22px;
}
.thead {
	background: linear-gradient(180deg, #2a1d06, #160f03) !important;
	border-bottom: 1px solid var(--line); color: var(--gold-300); padding: 14px 18px;
}
.thead strong, .thead a { font-family: var(--display); font-size: 16px; letter-spacing: .03em; color: var(--gold-300); }
.thead .expcolimage { margin-top: 2px; }
.tcat {
	background: var(--ink-900) !important; color: var(--parchment-dim); border: 0;
	border-bottom: 1px solid var(--line); padding: 8px 18px;
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
}
.tcat a { color: var(--parchment-dim); }
.trow1, .trow2, .trow_shaded {
	background: transparent !important; color: var(--parchment-dim);
	border: 0; border-top: 1px solid rgba(255, 255, 255, .04); padding: 14px 18px;
}
table.tborder tbody tr:hover > .trow1, table.tborder tbody tr:hover > .trow2 { background: rgba(255, 216, 107, .035) !important; }
.trow1 strong a, .trow2 strong a { color: var(--gold-300); font-size: 16px; font-weight: 700; }
.trow1 strong a:hover, .trow2 strong a:hover { color: var(--gold-200); }
.smalltext { color: var(--parchment-dim); font-size: 13px; }
.forum_status { width: 38px; height: 38px; border-radius: 12px; }
.forum_on { background: radial-gradient(circle at 35% 30%, var(--gold-300), var(--gold-700)) !important; box-shadow: 0 0 0 3px rgba(255, 216, 107, .12); }
.forum_off, .forum_offclose, .forum_offlink { background: var(--ink-700) !important; border: 1px solid var(--line); }

/* ---------- form ve dugmeler ---------- */
input.textbox, textarea, select {
	background: var(--ink-900); color: var(--parchment); border: 1px solid var(--line);
	border-radius: 10px; padding: 8px 12px;
}
input.textbox:focus, textarea:focus, select:focus { outline: none; border-color: var(--gold-600); box-shadow: 0 0 0 3px rgba(214, 167, 66, .2); }
button, input.button, a.button {
	background: linear-gradient(180deg, var(--gold-400), var(--gold-700)) !important;
	color: var(--ink-warm) !important; border: 0 !important; border-radius: 999px;
	padding: 8px 18px; font-weight: 800; cursor: pointer; text-shadow: none;
}
button:hover, input.button:hover, a.button:hover { filter: brightness(1.08); }

/* ---------- alt bilgi ---------- */
#footer .upper { background: var(--ink-900); border-top: 1px solid var(--line); border-bottom: 0; }
#footer .lower { background: var(--ink-950); color: var(--parchment-dim); }
#footer a, #footer .lower a { color: var(--parchment-dim); }
#footer a:hover { color: var(--gold-300); }

/* ==========================================================================
   Mobil: forum tablolari kart gorunumune gecer
   ========================================================================== */
@media (max-width: 760px) {
	html, body { font-size: 15px; }
	.wrapper { padding: 0 14px; }
	#logo .wrapper { min-height: 56px; }
	#logo a.km-home { font-size: 18px; padding: 10px 0; }
	#logo ul.top_links { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 8px; scrollbar-width: none; }
	#logo ul.top_links a { white-space: nowrap; font-size: 13px; padding: 6px 10px; background: rgba(255,255,255,.04) !important; }
	#panel .upper .wrapper { flex-direction: column; align-items: stretch; }
	#panel .upper a.login { display: block; text-align: center; padding: 12px 16px !important; }
	#search { width: 100%; }
	#search { display: flex; gap: 8px; min-width: 0; }
	#search input.textbox { flex: 1; width: auto; min-width: 0; box-sizing: border-box; }

	#content { padding: 18px 0 28px; }
	.navigation .active { font-size: 18px; }

	/* kategori tablolari: istatistik sutunlari gizlenir, satirlar kart olur */
	tbody[id^="cat_"] tr > td:nth-child(n+3),
	tbody[id^="cat_"] tr > .tcat:nth-child(n+2) { display: none; }
	tbody[id^="cat_"] tr:has(> .tcat) { display: none; }
	tbody[id^="cat_"] tr { display: flex; align-items: center; }
	tbody[id^="cat_"] tr > td:first-child { flex: 0 0 auto; width: auto; padding: 14px 0 14px 14px; }
	tbody[id^="cat_"] tr > .tcat:first-child { padding: 8px 14px; }
	tbody[id^="cat_"] tr > td:nth-child(2) { flex: 1 1 auto; min-width: 0; padding: 14px 14px; }
	tbody[id^="cat_"] tr > .tcat { flex: 1 1 auto; }
	.trow1 strong a, .trow2 strong a { font-size: 16px; }
	.thead { padding: 12px 14px; }
	.thead strong { font-size: 15px; }
	table.tborder { border-radius: 12px; margin-bottom: 16px; }

	/* genel tablolar (konu listesi vb.) yatay kaydirilabilir */
	#content > .wrapper > table.tborder:not(:has(tbody[id^="cat_"])) { display: block; overflow-x: auto; }
	#footer .wrapper { text-align: center; }
	#footer ul.menu { float: none; display: flex; justify-content: center; flex-wrap: wrap; }
}

/* ==========================================================================
   Konu listesi ve mesajlar
   ========================================================================== */
tr.inline_row > td { vertical-align: middle; }
tr.inline_row .subject_new a, tr.inline_row .subject_old a { color: var(--gold-300); font-weight: 700; font-size: 15px; }
.author.smalltext, .lastpost.smalltext { color: var(--parchment-dim); }
.pagination a, .pagination .pagination_current {
	border-radius: 8px; border: 1px solid var(--line); background: var(--ink-800); color: var(--gold-400); padding: 4px 9px;
}
.pagination .pagination_current { background: var(--gold-600); color: var(--ink-warm); }

#posts { border-radius: var(--radius); }
.post { background: var(--ink-800); border: 1px solid var(--line); border-radius: var(--radius); margin: 0 0 16px; overflow: hidden; }
.post .post_author {
	background: linear-gradient(180deg, #1d1504, var(--ink-800)); border-bottom: 1px solid var(--line);
	padding: 12px 16px; display: flex; align-items: center; gap: 12px;
}
.post .post_author div.author_avatar { float: none; margin: 0; }
.post .post_author div.author_avatar img { width: 48px; height: 48px; border-radius: 12px; border: 1px solid var(--line); object-fit: cover; }
.post .post_author div.author_information { float: none; padding: 0; }
.post .post_author div.author_information .largetext a { color: var(--gold-300); font-weight: 800; }
.post .post_author div.author_statistics { margin-left: auto; float: none; color: var(--parchment-dim); border: 0; font-size: 12px; text-align: right; }
.post .post_head { border-bottom: 1px solid rgba(255,255,255,.05); padding: 10px 16px; color: var(--parchment-dim); }
.post .post_body { color: #eadcae; padding: 16px; font-size: 15px; line-height: 1.7; }
.post .post_meta, .post .post_controls { background: transparent; border-top: 1px solid rgba(255,255,255,.05); padding: 8px 16px; }
.postbit_buttons > a:link, .postbit_buttons > a:visited {
	background: var(--ink-700) !important; border: 1px solid var(--line); color: var(--parchment) !important;
	border-radius: 999px; padding: 5px 12px; font-size: 13px;
}
.postbit_buttons > a:hover { border-color: var(--gold-600); color: var(--gold-200) !important; }
blockquote, .codeblock { background: var(--ink-900); border: 1px solid var(--line); border-left: 3px solid var(--gold-600); border-radius: 10px; color: var(--parchment-dim); }
blockquote cite { border-bottom: 1px solid var(--line); color: var(--gold-400); }

@media (max-width: 760px) {
	/* konu listesi: yalniz konu basligi ve yazar kalir */
	tr.inline_row > td:nth-child(n+4) { display: none; }
	table.tborder:has(tr.inline_row) tr:has(> .tcat) > .tcat:nth-child(n+4) { display: none; }
	.post .post_author { flex-wrap: wrap; }
	.post .post_author div.author_statistics { display: none; }
	.post .post_body { padding: 14px; }
	.postbit_buttons > a { margin-bottom: 4px; }
	.thead .float_right, .thead div.float_right { display: none; }
	.navigation .active { font-size: 17px; line-height: 1.3; }
	.thead strong { font-size: 15px; line-height: 1.35; }
}

/* Bolum durum ikonlari: MyBB'nin sprite'i yerine maske ile cizilen ikonlar (tema rengini alir) */
.forum_status { display: inline-grid; place-items: center; background-image: none !important; }
.forum_status::after { content: ''; width: 18px; height: 18px; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H9l-5 4v-4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H9l-5 4v-4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E") center / contain no-repeat; }
.forum_on { color: var(--gold-400); background: var(--ink-800) !important; border: 1px solid var(--gold-600); box-shadow: 0 0 12px rgba(255, 216, 107, .35); }
.forum_on::after { filter: drop-shadow(0 0 4px rgba(255, 216, 107, .8)); }
.forum_off { color: var(--parchment-dim); }
.forum_offclose { color: var(--parchment-dim); }
.forum_offclose::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3h1a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h1zm2 0h6V7a3 3 0 0 0-6 0v3z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3h1a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h1zm2 0h6V7a3 3 0 0 0-6 0v3z'/%3E%3C/svg%3E"); }
.forum_offlink { color: var(--gold-500); }
.forum_offlink::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 3h7v7h-2V6.4l-8.3 8.3-1.4-1.4L17.6 5H14V3zM5 5h6v2H5v12h12v-6h2v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 3h7v7h-2V6.4l-8.3 8.3-1.4-1.4L17.6 5H14V3zM5 5h6v2H5v12h12v-6h2v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2z'/%3E%3C/svg%3E"); }
/* --- Kullanici paneli / ozel mesajlar: yan menu + icerik tablosu mobilde alt alta --- */
@media (max-width: 760px) {
  #content > .wrapper > table:not(.tborder),
  #content > .wrapper > table:not(.tborder) > tbody,
  #content > .wrapper > table:not(.tborder) > tbody > tr,
  #content > .wrapper > table:not(.tborder) > tbody > tr > td,
  #content > .wrapper > form > table:not(.tborder),
  #content > .wrapper > form > table:not(.tborder) > tbody,
  #content > .wrapper > form > table:not(.tborder) > tbody > tr,
  #content > .wrapper > form > table:not(.tborder) > tbody > tr > td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
  }
  #content > .wrapper > table:not(.tborder) > tbody > tr > td + td,
  #content > .wrapper > form > table:not(.tborder) > tbody > tr > td + td { margin-top: 12px; }
  #content > .wrapper > table:not(.tborder) > tbody > tr > td + td { overflow-x: auto; }
}

/* --- Mobil performans: sabit arka plan ve bulanik ust bar kaydirmada her karede yeniden ciziliyordu --- */
@media (max-width: 760px), (hover: none) {
  body { background-attachment: scroll, scroll; }
  #header #logo { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .forum_on::after { filter: none; }
}
