/*
 * BEKA2 ortak yerleşim düzeltmesi
 * Eski Metin2 temasındaki sabit ölçüleri yeni üç sütunlu yapıya uyarlar.
 */

html,
body {
	min-width:0 !important;
	overflow-x:hidden;
}

.classic-site,
.classic-site *,
.classic-site *::before,
.classic-site *::after {
	box-sizing:border-box;
}

.classic-site {
	width:1220px !important;
	max-width:100% !important;
	overflow:hidden !important;
}

.classic-columns {
	width:1160px !important;
	max-width:calc(100% - 24px) !important;
	grid-template-columns:190px minmax(0,750px) 190px !important;
	gap:15px !important;
}

.left-column,
.center-column,
.right-column {
	min-width:0 !important;
	max-width:100% !important;
}

.side-box,
.visual-card {
	width:100% !important;
	max-width:100% !important;
	overflow:hidden;
}

/* Sağ giriş kutusu: eski 290px form ve 265px input ölçülerini kaldırır. */
.right-column #loginForm,
.right-column form,
.login-classic form {
	width:100% !important;
	max-width:100% !important;
	margin:0 !important;
	padding:0 !important;
	float:none !important;
}

.right-column #loginForm > div,
.right-column form > div,
.login-classic form > div {
	width:100% !important;
	max-width:100% !important;
	margin:0 0 8px !important;
	padding:0 !important;
}

.right-column input[type="text"],
.right-column input[type="password"],
.right-column input[type="email"],
.right-column select,
.right-column button,
.login-classic input,
.login-classic button {
	display:block !important;
	float:none !important;
	width:100% !important;
	max-width:100% !important;
	min-width:0 !important;
	height:28px !important;
	margin:3px 0 0 !important;
	padding:4px 6px !important;
}

.login-classic label {
	width:100% !important;
	max-width:100% !important;
	overflow:hidden;
}

.login-classic .g-recaptcha {
	margin:4px 0 -25px -57px !important;
	transform:scale(.52) !important;
	transform-origin:top center !important;
}

/* İç sayfaların eski ahşap 507px çerçevesini ve alt süs taşmasını kaldırır. */
.center-column > [role="main"] {
	position:relative !important;
	left:auto !important;
	top:auto !important;
	display:block !important;
	float:none !important;
	width:100% !important;
	max-width:100% !important;
	height:auto !important;
	min-height:0 !important;
	margin:0 !important;
	padding:0 !important;
	background:none !important;
	overflow:visible !important;
}

.center-column > [role="main"]::before,
.center-column > [role="main"]::after {
	display:none !important;
	content:none !important;
}

.center-column .content,
.center-column .content-last,
.center-column .content-bg,
.center-column .content-bg-bottom,
.center-column .inner-content,
.center-column .download-inner-content,
.center-column .ranks-inner-content,
.center-column .administration-inner-content,
.center-column .main-content,
.center-column .inner-form-border,
.center-column .inner-form-box {
	position:relative !important;
	left:auto !important;
	top:auto !important;
	display:block !important;
	float:none !important;
	width:100% !important;
	max-width:100% !important;
	height:auto !important;
	min-height:0 !important;
	margin:0 !important;
	background:none !important;
}

.center-column .content,
.center-column .content-last {
	padding:0 !important;
}

.center-column .content-bg {
	padding:12px !important;
	color:#351507 !important;
	border:1px solid #9e7a3b !important;
	background-color:#dcc48b !important;
	background-image:linear-gradient(rgba(255,255,255,.12),rgba(83,42,8,.04)),url('../img/c3d63d90f91f78a04939e2ac1a9755.jpg') !important;
	background-size:auto,cover !important;
	box-shadow:inset 0 0 8px rgba(74,35,5,.28) !important;
}

.center-column .content-bg-bottom {
	padding:0 !important;
	overflow:visible !important;
}

.center-column .content h2,
.center-column > [role="main"] > h2 {
	width:100% !important;
	min-height:36px !important;
	height:auto !important;
	margin:0 0 14px !important;
	padding:9px 14px !important;
	color:#7c190c !important;
	border:1px solid #aa8343 !important;
	background:rgba(189,148,75,.22) !important;
	font:700 15px Georgia,serif !important;
}

.center-column .inner-form-border {
	width:min(100%,560px) !important;
	margin:14px auto !important;
	padding:0 !important;
	border:1px solid #aa8551 !important;
}

.center-column .inner-form-box {
	padding:18px !important;
	color:#4a1e00 !important;
	border:1px solid #c6ab74 !important;
	background:rgba(255,247,216,.12) !important;
}

.center-column .trenner {
	width:100% !important;
	max-width:100% !important;
}

/* Kayıt, giriş, profil ve şifre formları. */
.center-column #registerForm,
.center-column #loginForm,
.center-column #pwlostForm,
.center-column #lostPasswordCodeForm,
.center-column #changepwForm,
.center-column #emailChangeForm,
.center-column #resendactivForm,
.center-column #moveForm,
.center-column #captchaForm,
.center-column #regForm1 {
	width:min(100%,430px) !important;
	max-width:100% !important;
	margin:15px auto !important;
	padding:0 !important;
}

.center-column form > div {
	position:relative !important;
	width:100% !important;
	max-width:100% !important;
	margin:0 0 12px !important;
}

.center-column form label {
	display:block !important;
	float:none !important;
	width:100% !important;
	margin:0 0 5px !important;
}

.center-column form input[type="text"],
.center-column form input[type="password"],
.center-column form input[type="email"],
.center-column form input[type="tel"],
.center-column form select,
.center-column .select-box {
	display:block !important;
	float:none !important;
	width:100% !important;
	max-width:100% !important;
	min-width:0 !important;
	height:34px !important;
	margin:0 !important;
	padding:5px 9px !important;
}

.center-column #submitBtn,
.center-column input[type="submit"],
.center-column .btn-big {
	display:block !important;
	float:none !important;
	width:100% !important;
	max-width:100% !important;
	min-width:0 !important;
	height:38px !important;
	margin:18px 0 5px !important;
	padding:5px 12px !important;
}

.center-column .g-recaptcha {
	max-width:100% !important;
	transform:scale(.88) !important;
	transform-origin:left top !important;
	margin-left:0 !important;
}

/* İndirme sayfası: sabit 450px tablo ve metin genişliklerini kaldırır. */
.center-column #downloadText,
.center-column #required,
.center-column #highscore,
.center-column .download-inner-content,
.center-column .download-inner-content p {
	width:100% !important;
	max-width:100% !important;
	margin-left:0 !important;
}

.center-column #download table,
.center-column #highscore table,
.center-column #guildHighscore table,
.center-column table {
	width:100% !important;
	max-width:100% !important;
	margin:0 !important;
	table-layout:auto !important;
	border-collapse:collapse !important;
}

.center-column table th,
.center-column table td {
	width:auto !important;
	max-width:none !important;
	height:auto !important;
	padding:8px 6px !important;
	vertical-align:middle !important;
	white-space:normal !important;
	word-break:normal !important;
}

.center-column #download table td:last-child {
	text-align:right !important;
}

.center-column #requirements {
	display:inline-block !important;
	margin:14px 0 8px !important;
}

/* Oyuncu/lonca sıralamasındaki eski iki buton ve tablo ölçüleri. */
.center-column .ranks-inner-content .bg-dark {
	display:grid !important;
	grid-template-columns:1fr 1fr !important;
	gap:10px !important;
	width:100% !important;
	min-height:0 !important;
	margin:0 0 14px !important;
	padding:10px !important;
	overflow:hidden !important;
}

.center-column .ranks-inner-content .col-50 {
	float:none !important;
	width:100% !important;
	margin:0 !important;
}

.center-column .ranks-inner-content .btn {
	display:block !important;
	float:none !important;
	width:100% !important;
	margin:0 !important;
	text-align:center !important;
}

.center-column .ranks-nav,
.center-column .clearfloat,
.center-column .box-foot,
.center-column .download-box-foot,
.center-column .shadow {
	max-width:100% !important;
}

.center-column .class-portrait,
.center-column table img {
	max-width:34px !important;
	height:auto !important;
}

/* Sağ mini sıralama: her satır üç kolonda kalır. */
.right-column .ranking-classic {
	overflow:hidden !important;
}

.right-column .ranking-classic > a {
	display:grid !important;
	grid-template-columns:20px minmax(0,1fr) auto !important;
	gap:3px !important;
	width:100% !important;
	height:29px !important;
	padding:0 3px !important;
	overflow:hidden !important;
}

.right-column .ranking-classic > a span {
	min-width:0 !important;
	overflow:hidden !important;
	text-overflow:ellipsis !important;
	white-space:nowrap !important;
}

.right-column .ranking-classic > a em {
	white-space:nowrap !important;
}

/* Video yan panoları: örnek resimler tam alanı doldurur. Aynı dosya adlarıyla değiştirilebilir. */
.video-showcase .video-wing {
	position:relative !important;
	min-height:0 !important;
	border:1px solid #7c511e !important;
	background:#100704 !important;
	box-shadow:inset 0 0 25px #000 !important;
}

.video-showcase .video-wing::after {
	display:none !important;
}

.video-showcase .video-wing > img {
	position:absolute !important;
	inset:0 !important;
	z-index:0 !important;
	width:100% !important;
	height:100% !important;
	max-width:none !important;
	border:0 !important;
	border-radius:0 !important;
	object-fit:cover !important;
	box-shadow:none !important;
	animation:none !important;
}

.video-showcase .wing-left > img { object-position:38% center !important; }
.video-showcase .wing-right > img { object-position:62% center !important; }

.video-showcase .video-wing::before {
	content:"" !important;
	position:absolute !important;
	inset:0 !important;
	z-index:1 !important;
	background:linear-gradient(to bottom,rgba(5,2,1,.03) 45%,rgba(5,2,1,.92) 100%) !important;
}

.video-showcase .wing-caption {
	position:absolute !important;
	left:8px !important;
	right:8px !important;
	bottom:13px !important;
	z-index:2 !important;
	text-align:center !important;
	text-shadow:0 2px 3px #000 !important;
}

.video-showcase .wing-caption b { margin:0 !important; color:#f2cf77 !important; }
.video-showcase .wing-caption span { color:#d1ad65 !important; }

/* Eski sıralama şablonundaki boş ok çubuklarını ve kayan başlıkları temizler. */
.center-column .ranks-inner-content > .ranks-nav,
.center-column .ranks-inner-content > br.clearfloat {
	display:none !important;
}

.center-column #highscore .content-bg-bottom > h2,
.center-column #guildHighscore .content-bg-bottom > h2 {
	box-sizing:border-box !important;
	width:100% !important;
	height:auto !important;
	margin:0 0 12px !important;
	padding:10px 14px !important;
	border:1px solid #9b7137 !important;
	color:#73190f !important;
	background:rgba(220,190,125,.3) !important;
	font:700 17px Georgia,serif !important;
	line-height:1.2 !important;
}

.center-column .ranks-inner-content > br {
	display:none !important;
}

.center-column .ranks-inner-content .bg-dark {
	margin:0 0 18px !important;
	border:1px solid #a77a39 !important;
	background:rgba(91,48,13,.12) !important;
}

.center-column .ranks-inner-content .btn {
	box-sizing:border-box !important;
	min-height:34px !important;
	padding:8px 10px !important;
	border:1px solid #5d260b !important;
	color:#f7dfa0 !important;
	background:linear-gradient(#a51d12,#690b07) !important;
	text-decoration:none !important;
	text-shadow:0 1px 2px #000 !important;
	user-select:none !important;
}

.center-column .ranks-inner-content .btn.active,
.center-column .ranks-inner-content .btn:hover {
	background:linear-gradient(#d19b3a,#8d3d0c) !important;
}

.center-column #highscore table,
.center-column #guildHighscore table {
	clear:both !important;
	margin-top:0 !important;
}

.right-column .ranking-classic > a {
	box-sizing:border-box !important;
	line-height:29px !important;
}

.right-column .ranking-classic > a b,
.right-column .ranking-classic > a span,
.right-column .ranking-classic > a em {
	display:block !important;
	line-height:29px !important;
}

.classic-site footer {
	clear:both !important;
}

/* Tablet: sağ kutuları merkezin altına alır; taşma bırakmaz. */
@media (max-width:1100px) {
	.classic-columns {
		width:940px !important;
		grid-template-columns:180px minmax(0,745px) !important;
		grid-template-areas:
			"left center"
			"right center" !important;
		gap:15px !important;
	}

	.left-column { grid-area:left !important; }
	.center-column { grid-area:center !important; }
	.right-column { grid-area:right !important; }
}

/* Telefon ve dar tablet: orta içerik önce, yan kutular sonra. */
@media (max-width:760px) {
	.classic-columns {
		display:flex !important;
		flex-direction:column !important;
		width:auto !important;
		max-width:calc(100% - 18px) !important;
	}

	.center-column {
		order:1 !important;
		width:100% !important;
	}

	.right-column,
	.left-column {
		order:2 !important;
		display:grid !important;
		grid-template-columns:repeat(2,minmax(0,1fr)) !important;
		width:100% !important;
		gap:24px 12px !important;
	}

	.left-column { order:3 !important; }

	.center-column {
		padding:7px !important;
	}

	.center-column table {
		font-size:9px !important;
	}

	.center-column table th,
	.center-column table td {
		padding:6px 3px !important;
	}
}

@media (max-width:480px) {
	.right-column,
	.left-column {
		grid-template-columns:1fr !important;
	}

	.download-ribbon {
		max-width:calc(100% - 16px) !important;
	}

	.center-column .inner-form-box {
		padding:12px !important;
	}

	.center-column .g-recaptcha {
		transform:scale(.74) !important;
	}

	.center-column #highscore,
	.center-column #guildHighscore {
		overflow-x:auto !important;
	}

	.center-column #highscore table,
	.center-column #guildHighscore table {
		min-width:610px !important;
	}

	.center-column > [role="main"] h4[style*="230px"] {
		font-size:110px !important;
	}
}

@media (prefers-reduced-motion:reduce) {
	.classic-site *,
	.classic-site *::before,
	.classic-site *::after {
		animation-duration:.01ms !important;
		animation-iteration-count:1 !important;
	}
}