/* =============================================================================
   1. TEMEL VE GENEL AYARLAR
============================================================================= */
html, body {
    padding: 0;
    margin: 0;
    height: 100%;
}

body {
    background-color: #0f0f0f;
    background-image: url('../images/bg.jpg');
    background-repeat: repeat-y;
    background-position: center top;
    text-align: center;
    color: #422100;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    cursor: url(scripts/mu2.cur), auto;
}

a {
    text-decoration: none;
    color: #3D1C02;
    font-size: 11px;
    cursor: url(scripts/mu.cur), auto;
}
a:hover {
    font-weight: bold;
    color: #a85204;
}
a:focus { outline: none; }
a img { border: none; }

td {
    color: #882D17; /*Karakter siralaması yazısı renk*/
    font-size: 12px;
	font-weight: 700; /* Bu da kalın (bold) demektir */
}

h4 {
    color: #422100;
    font: bold 15px Arial;
    margin-bottom: 7px;
    margin-left: 30px;
}
h4 span.info {
    color: #98826b;
    font-size: 13px;
    margin-right: 20px;
    float: right;
}

.clear { clear: both; }
.seperator {
    background-image: url('../images/hr-line.png');
    background-repeat: no-repeat;
    height: 17px;
    width: 473px;
}

/* =============================================================================
   2. ANA SAYFA YERLEŞİMİ (LAYOUT)
============================================================================= */
.wrapper {
    /* Bu, body'deki ana arka planı kullanır */
}

#page {
    width: 982px;
    margin: 0 auto;
    text-align: left; /* İçeriği sola yaslıyoruz */
    position: relative;
    min-height: 100%;
    padding-bottom: 135px; /* Footer yüksekliği kadar boşluk */
    box-sizing: border-box;
}

.page2 {
    background: url('../images/page-h.jpg') no-repeat scroll center top transparent;
}
/* =============================================================================
   FLOAT TEMİZLEME VE KAYDIRMA ÇUBUĞU SORUNU ÇÖZÜMÜ
============================================================================= */

/* .page2 kutusunun, içindeki sol/sağ menüleri doğru şekilde sarmasını sağlar */
.page2::after {
    content: "";
    display: table;
    clear: both;
}
.pagetitle {
    color: #C7AC84;
    height: 35px;
    padding-top: 7px;
    text-align: center;
}

#footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 228px;
    background: url('../images/footer.png') no-repeat center;
    color: #422100;
    font-size: 11px;
    font-weight: bold;
    text-align: center;
}
#footer p {
    padding-top: 60px; /* Yazıyı resim üzerinde aşağı itmek için */
}
#footer a { color: #422100; }
#footer a:hover { color: #a85204; }


/* =============================================================================
   3. ÜST BANNER (HEADER)
============================================================================= */
.head1 {
    background: url('../images/head1.jpg') no-repeat center top;
    height: 80px;
}
.head2 {
    background: url('../images/head2.jpg') no-repeat center top;
    height: 80px;
}
.head3 {
    background: url('../images/head3.jpg') no-repeat center top;
    height: 100px;
}
#header { height: 245px; } /* Bu bölüm eski bir tasarımdan kalma olabilir */


/* =============================================================================
   4. KOLONLAR VE İÇERİK BÖLÜMÜ
============================================================================= */
#sb-left, #content, #sb-right {
    min-height: 500px;
    float: left;
}

#sb-left { width: 235px; }
#content { width: 513px; padding-top: 30px; }
#sb-right{
  width:234px;
  position:relative;
  left:15px;
}


/* Orta İçerik Kutusu Stilleri */
.middle_top {
    background: url('../images/bc-head.png') no-repeat center top;
    height: 37px;
    width: 513px;
}
.middle_center {
    background: url('../images/bc-center.png') repeat-y center center;
    width: 513px;
    padding-bottom: 5px;
}
.middle_bottom {
    background: url('../images/bc-bottom.png') no-repeat center top;
    height: 22px;
    width: 513px;
    margin-top: -5px;
}

/* =============================================================================
   5. SOL MENÜ (SIDEBAR LEFT)
============================================================================= */
#sb-left .bl {
    background: url('../images/bl-bg.png') no-repeat left bottom;
    padding-bottom: 60px;
    width: 235px;
}
#sb-left .bl img:first-child {
    margin-top: 15px; /* Menü başlık resmini aşağı kaydırır */
}
#sb-left .bl .mainMenu {
    padding: 0;
    text-align: center;
}
#sb-left .bl .mainMenu a {
    display: inline-block;
    width: 170px;
    height: 45px;
    background: url('../images/buton.png') no-repeat center center;
    background-size: cover;
    line-height: 57px;
    color: #e5d1a9;
    font-family: 'Alfa Slab One', sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-shadow: 5px 5px 8px #cdc897;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    position: relative;
    left: 17px;      /* Sol menu butonların hepsini birde sağa ve sola kaydırmak icin*/
    margin-bottom: 1px; /* Butonlar arası boşluk */
	padding-left: 12px;         /* YAZIYI SAĞA KAYDIRMAK İÇİN EKLENDİ */
}
#sb-left .bl .mainMenu:first-child a {
    margin-top: -8px;
    top: 5px;
}
#sb-left .bl .mainMenu a:hover {
    /*filter: brightness(1.5);*/
	transform: scale(1.25); /* Hafifçe büyütme */
}
/* Parlama efektini sadece bağlantı (a) içindeki yazıya (span) uygula */
#sb-left .bl .mainMenu a:hover span {
    filter: brightness(1.2); /* Yazının üzerine gelindiğinde parlaması için bu kuralı kullanın. */
	color: #fcf4a9;
    
}
#sb-left .bl .mainMenu a:active {
    transform: translateY(1px);
}

/* =============================================================================
   6. SAĞ MENÜ (SIDEBAR RIGHT)
============================================================================= */
.br {
    background: url('../images/br-bg.png') no-repeat scroll right bottom transparent;
    font-size: 13px;
    padding-bottom: 20px;
    width: 235px;
    background-position: right -15px !important;
}
#sb-right .br:first-child { /* Giriş Paneli */
    position: relative;
    left: -15px;
    top: -8px;
}
/*
 * Sağ menüdeki "Şifremi Unuttum" butonunu
 * "Kayıt Ol" butonundan ayırmak için eklendi.
 */
#sb-right a.regs {
    margin-left: 2px; /* Soldan 5 piksel boşluk ekler */
	margin-top: 5px;  /* Üstten boşluk (AŞAĞI KAYDIRIR) */
}

/*
 * Sağ menüdeki "Giriş" ve "Kayıt Ol" butonlarına
 * üstten boşluk vermek için eklendi.
 */
#sb-right .login,
#sb-right a.reg {
    margin-top: 5px;
}

#sb-right .br:first-child img {
    margin-top: 20px;
}
#sb-right .br:nth-child(2) img { /* Karakterler Başlığı */
    margin-top: -15px !important;
}
#sb-right .br:nth-child(3) img { /* Loncalar Başlığı */
    margin-top: -15px !important;
}
#sb-right p {
    font-size: 9px;
    margin: 0 0 0 18px;
    padding: 0;
    color: #422100;
    width: 88%;
}

/* =============================================================================
   7. FORMLAR VE BUTONLAR
============================================================================= */
/* Giriş Formu ve Diğer Form Alanları */
input.dat {
    margin-left: -15px;
    background: url('../images/input.png') repeat scroll left center transparent;
    border: 1px solid #989064;
    border-radius: 5px;
    color: #706940;
    height: 18px;
    padding-left: 3px;
    width: 118px;
}

.hesapdit {
    border: 1px solid #282828;
    background: url('../images/input.png') repeat scroll left center transparent;
    color: #706940;
    padding: 4px;
    border-radius: 5px;
}

.dattiridit, .dattiridit2 {
    border: 1px solid #282828;
    background: url('../images/input.png') repeat scroll left center transparent;
    font-size: 10px;
    color: #706940;
    padding: 4px;
    margin: 5px 0 0 35px;
    border-radius: 5px;
}
.dattiridit2 { padding: 4px 20px; }
.dattiridit1 { width: 0; height: 0; border: none; } /* Gizlenmiş select kutusu */

.hesapyazi {
    color: #422100;
    font-size: 13px;
    padding-top: 2px;
}

/* Genel Buton Stilleri */
.btn, .degis, .login, a.reg, a.regs, a.regs1, a.regs2 {
    display: inline-block;
    border: 1px solid #000000;
    background-color: #660000;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    color: #FFFFFF;
    text-shadow: 0.1em 0.1em 0.2em black;
    border-radius: 5px;
    line-height: 1.9;
    padding-bottom: 1px;
    height: 22px;
}
.login { margin-right: 5px; }
a.reg { width: 65px; float: none; }
a.regs { width: 120px; float: none; margin-top: -1px; }
a.regs1 { width: 60px; float: left; margin: 0 5px 0 0; }
a.regs2 { width: 80px; float: left; margin: 0 5px 0 0; }

.login:hover, a.reg:hover, a.regs:hover, a.regs1:hover, a.regs2:hover, .degis:hover {
    background-color: #7F1C1C;
}

/* Kayıt Formu Stilleri */
#regForm {
    margin: 0 auto;
    padding: 1px;
    width: 88%;
}
#regForm label {
    display: inline-block;
    width: 100px;
    font-size: 12px;
    cursor: pointer;
}
#regForm em { /* Yıldız işaretleri */
    color: #F00;
    font-size: 9px;
    float: left;
    margin-right: 4px;
}
/* =============================================================================
   8. SIRALAMA SAYFALARI
============================================================================= */
#gBar {
    margin: 10px 0 5px 40px;
    font-size: 12px;
    overflow: auto; /* İçindeki float'ları sarması için */
    width: 100%;
}
#gBar a {
    color: #999;
    padding: 2px 8px;
    background: #660000;
    border: 1px solid #000000;
}
#gBar a:hover {
    background-color: #7F1C1C;
    border: 1px solid #000000;
}

#rankingTable {
    width: 90%;
    margin: 0 auto;
}
#rankingTable table {
    width: 100%;
    padding: 1px;
    font-size: 10px;
    border: 1px solid #333;
    text-align: center;
    color: #CCC;
    background: #0a0a0a;
    margin: 10px auto 0;
}
#rankingTable table tr.rank_head td {
    background-color: #000;
    color: #F90;
    font-size: 12px;
    padding: 5px;
    border-bottom: 1px solid #333;
}
#rankingTable table tr.rank_player td {
    border-bottom: 1px dashed #1a191a;
    padding: 3px;
    background: #121112;
}
#rankingTable a { color: #CCC; }
#rankingTable a:hover { text-decoration: underline; }


/* =============================================================================
   9. HABER BÖLÜMÜ (POST UI)
============================================================================= */
.postui {
    background: url('../images/ui/postui.jpg');
    width: 476px;
    margin: 0 auto 5px;
    overflow: hidden;
}
.postui a { color: #d5d5d5; }
.postui a:hover { color: #FFF; }

.pfulll { /* Haber listesi ve haber okuma sayfası için */
    width: 476px;
    overflow: hidden;
    margin: 0 auto 5px;
}
.pfulll .pright {
    width: 475px;
    float: left; /* center yerine left olmalı */
    padding-top: 13px;
    padding-left: 15px; /* Yazının kenara yapışmaması için */
    box-sizing: border-box;
}
.pfulll h3 {
    color: #d5d5d5;
    font-size: 12px;
    margin: 0;
    padding: 0 0 4px 0;
}
.pfulll p {
    font-size: 11px;
    width: 97%;
    color: #767676;
    padding: 0;
    margin: 0;
}


/* =============================================================================
   10. ÇEŞİTLİ ESKİ STİLLER (Temizlendi ve Korundu)
============================================================================= */
/* Bu bölüm, orijinal dosyanızdaki diğer tüm küçük stil kurallarını içerir. */
/* Kullanılmayan #navigation bölümü gibi büyük bloklar temizlenmiştir. */

.votelink img {
    margin: 7px 0 0 10px;
}

#tooltip {
    position: absolute;
    border: 1px solid #F90;
    background: #f7f5d1;
    padding: 2px 5px;
    color: #A5550E;
    display: none;
    font-size: 12px;
}

/* Sunucu Durumu */
.servstat {
    font-size: 10px;
    color: #777777;
    height: 89px;
    width: 145px;
    margin-left: 15px;
    padding: 0px;
}
.servstat p { margin: 0; padding: 0 0 0 10px; }
.servstat .on { color: #65fc3c; }
.servstat .off { color: #e82121; }
.servstat p .count { color: #ffea00; }

/* Haber Slider (Kullanımda değilse bile stilleri duruyor) */
#nslider {
    height: 138px;
    width: 100%;
    background: url('../images/ui/nslider.jpg');
}
#slider {
    overflow: hidden;
    height: 79px;
    width: 509px;
    position: relative;
    top: 14px;
    left: 18px;
}
#nslider ul, #nslider ul li, #nslider ol, #nslider ol li {
    margin: 0; padding: 0; list-style: none;
}
/* =============================================================================
   11. EŞYA MARKET (ITEM SHOP) - İlgili Stiller
============================================================================= */
/* Bu stiller, ana sitede değil, /shop/ veya /pazar/ gibi 
   iframe ile çağrılan sayfalarda daha çok etkilidir. */

.itemDetail {
    background: #000;
    margin: 10px auto;
    padding: 5px;
    width: 85%;
    border: 1px solid #333;
}
.itemInfo {
    padding: 10px;
    border-bottom: 1px dashed #1c1c1c;
    margin-bottom: 5px;
}
.itemDetail h3 {
    color: #FC0;
    margin: 5px 0 5px 0;
}
.itemDetail p {
    margin: 0;
    padding: 5px;
    font-size: 12px;
    color: #999;
}
.itemDetail img {
    float: right;
    margin-left: 15px;
    padding-left: 5px;
}
.stats, .stats2 {
    width: 20%;
    margin: 5px;
    float: left;
    font-size: 12px;
}
.stats2 { width: 30%; }
.stats td, .stats2 td {
    border: 1px solid #333333;
    padding: 0 10px 0 10px;
}
.statcap {
    color: #780000;
    background-color: #444444;
    width: 30%;
}
.stat {
    background-color: #555555;
    width: 10%;
    text-align: right;
}

/* =============================================================================
   TANITIM SAYFASI ÖZEL STİLLERİ
============================================================================= */

/* 1. Sabit Arka Plan */
/* Sadece tanıtım sayfasında arka planın kaymasını engeller */
body.tanitim-sayfasi {
    background-attachment: fixed;
}

/* 2. Kaydırılabilir Galeri Alanı */
.tanitim-galeri {
    height: 1024px; /* Bu yüksekliği artırıp azaltarak alanı ayarlayabilirsiniz */
    overflow-y: auto; /* Yükseklik aşıldığında dikey kaydırma çubuğu çıkarır */
    padding: 40px 15px 15px 15px;
    box-sizing: border-box;
}

/* 3. Galeri İçindeki Görsellerin Stili */
.tanitim-gorsel {
    text-align: center;
    margin-bottom: 25px; /* Görseller arası dikey boşluk */
}
.tanitim-gorsel img {
    max-width: 100%; /* Resimlerin kutudan taşmasını engeller */
    height: auto;
    border: 4px solid #4a2c11; /* Sitenizin renklerine uygun bir çerçeve */
    border-radius: 8px; /* Yumuşak kenarlar */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); /* Daha belirgin bir gölge */
}

/* 4. Kaydırma Çubuğunu Güzelleştirme (Opsiyonel ama şık durur) */
/* Firefox için */
.tanitim-galeri {
  scrollbar-width: thin;
  scrollbar-color: #650000 #D9D5CA;
}
/* Chrome, Safari, Edge için */
.tanitim-galeri::-webkit-scrollbar {
  width: 10px;
}
.tanitim-galeri::-webkit-scrollbar-track {
  background: #D9D5CA;
}
.tanitim-galeri::-webkit-scrollbar-thumb {
  background-color: #650000;
  border-radius: 5px;
  border: 2px solid #D9D5CA;
}

/*////////////////////////////////////////////////////////////////*//*////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////*//*////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////*//*////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////*//*////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////*//*////////////////////////////////////////////////////////////////*/
/*////////////////////////////////////////////////////////////////*//*////////////////////////////////////////////////////////////////*/

/* =============================================================================
   TANITIM SAYFASI BAŞLIK VE POP-UP STİLLERİ (DÜZELTİLMİŞ VERSİYON)
============================================================================= */

/* 1. Görsel Kutusunu Ortalamak */
.tanitim-gorsel-kutu {
    text-align: center;
    margin-bottom: 25px;
    padding-bottom: 20px;
}

/* =============================================================================
   KATEGORİLİ TANITIM SAYFASI STİLLERİ
============================================================================= */

/* Kategori butonlarının listelendiği ana kutu */
#tanitim-kategoriler {
    padding-top: 50px;
    text-align: center;
}

/* Her bir kategori butonu */
.kategori-buton {
    display: block;
    width: 250px; /* Buton genişliği */
    height: 55px; /* Buton yüksekliği */
    background-image: url('../images/tanitim/buton.png');
    background-size: 100% 100%; /* Resmi butona sığdır */
    background-repeat: no-repeat;
    margin: 0 auto 0px auto; /* Butonları ortala ve aralarına boşluk koy */
    position: relative;
    color: #ffffaf;
    text-decoration: none;
    transition: transform 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease; /* 'filter' eklendi */
}

/* Butonun üzerindeki yazı */
.kategori-buton span {
    position: absolute;
    top: 25px;          /* AŞAĞI-YUKARI ayarı. Artırırsanız AŞAĞI iner, azaltırsanız YUKARI çıkar. */
    left: 0;
    right: 0;
    text-align: center;
    padding-left: 7px;  /* SAĞA-SOLA ayarı. Artırırsanız SAĞA gider, azaltırsanız SOLA gider. */
    font-size: 1.2em;
    font-weight: bold;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
    width: 100%;
}

/* Resim galerisinin ana kutusu */
#tanitim-galeri-icerik {
    padding-top: 20px;
}

/* Geri Dön Butonu */
.geri-buton {
	
    display: inline-block;
    padding: 8px 15px;
    margin-left: 20px;
    margin-bottom: 20px;
    background-color: #a85204;
    color: #fff;
    border-radius: 5px;
    font-weight: bold;
    text-decoration: none;
}
/* Tanıtım sayfası ana başlığı */
.tanitim-ana-baslik {
    width: 450px; /* Diğer butonlardan daha geniş */
    height: 70px; /* Biraz daha yüksek */
    background-image: url('../images/tanitim/buton.png');
    background-size: 100% 100%;
    margin: -70px auto 15px auto; /* Ortala ve alttaki butonlarla arasını aç */
    position: relative;
	left: -12px; /* BUTONU SOLA ÇEKMEK İÇİN EKLENDİ */
}

.tanitim-ana-baslik span {
    position: absolute;
    top: 25px;          /* YUKARI-AŞAĞI ayarı. Değeri azaltırsanız yazı YUKARI çıkar, artırırsanız AŞAĞI iner. */
    left: 0;            /* Bu satır yatayda ortalamak için gerekli */
    right: 0;           /* Bu satır yatayda ortalamak için gerekli */
    font-size: 1.5em;
    font-weight: bold;
    color: #ff3d0d;
    text-shadow: 
        1px 1px 0px #000, 
        2px 2px 0px #000,
        3px 3px 0px #000,
        4px 4px 5px rgba(0,0,0,0.8);
    width: 100%;
    letter-spacing: 2px;
}
.geri-buton:hover {
    background-color: #d86c0c;
    color: #fff;
}

/* DÜZELTME 1: Başlığın doğru konumlanması için referans noktası burası olmalı */
.tanitim-gorsel {
    position: relative; /* Başlık artık bu kutuya göre kendini hizalayacak */
}
.tanitim-gorsel img {
    max-width: 100%;
    height: auto;
    border: 4px solid #4a2c11;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

/* 2. 3D Başlık Stili */
.gorsel-baslik {
    position: absolute;
    top: -20%; /*Konu başlıkları tanitim resimlerinin üzerindeki */
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 2.2em;
    font-weight: bold;
    text-shadow: 
        1px 1px 0px #000, 
        2px 2px 0px #000,
        3px 3px 0px #000,
        4px 4px 5px rgba(0,0,0,0.7);
    letter-spacing: 1.5px;
    z-index: 10;
    white-space: nowrap;
    pointer-events: none; /* Başlığın tıklamaları engellememesi için */
}

/* 3. Detay Butonu Stili */
.detay-buton {
    display: inline-block;
    /* DÜZELTME: Butonu küçültmek için padding ve font boyutunu azalttık */
    padding: 6px 12px;
    margin-top: 0px; 
    background-color: #a85204;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: bold;
    text-transform: uppercase;
    transition: background-color 0.3s ease;
}
.detay-buton:hover {
    background-color: #d86c0c;
}

/* 4. Pop-up Penceresi Stili */
#detay-popup {
    position: fixed;
    z-index: 10001;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    
    /* DÜZELTME 2: Yumuşak bir açılıp kapanma efekti ekliyoruz */
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Pop-up'ın başlangıçta KESİNLİKLE gizli olmasını sağlıyoruz */
#detay-popup.popup-gizli {
    opacity: 0;
    visibility: hidden;
}

/* Pop-up gösterildiğinde */
#detay-popup.popup-goster {
    opacity: 1;
    visibility: visible;
}

.popup-icerik {
    background-color: #fefefe;
    padding: 30px;
    border: 1px solid #888;
    width: 80%;
    max-width: 550px;
    border-radius: 10px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    position: relative;
    text-align: center;
    color: #333;
}

#popup-baslik {
    font-size: 1.8em;
    color: #a85204;
    margin-bottom: 15px;
}

#popup-detay {
    font-size: 1.1em;
    line-height: 1.6;
}

.popup-kapat {
    color: #aaa;
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}
.popup-kapat:hover,
.popup-kapat:focus {
    color: #000;
}

/* =============================================================================
   ANA SIRALAMA SAYFASI TABLO STİLİ GÜNCELLEMESİ
============================================================================= */

/* SADECE ana sıralama sayfasındaki (#rankingTable) tablonun genelini hedefler.
   Sağ menüyü etkilemez. */
#rankingTable table {
    background: #e9e5d9; /* Tablonun ana arka plan rengi (açık krem) */
    border: 1px solid #4a2c11; /* Dış çerçeve rengi */
    color: #422100;    /* Genel yazı rengi */
}

/* SADECE ana sıralama sayfası başlık satırını (Sıra, İsim, Level vb.) hedefler. */
#rankingTable table tr.rank_head td {
    background-color: #d1c8b3; /* Başlık için biraz daha koyu krem */
    color: #4a2c11;            /* Başlık yazı rengi */
    font-size: 12px;
    font-weight: bold;
    border-bottom: 1px solid #4a2c11;
}

/* SADECE ana sıralama sayfasındaki oyuncu satırlarını hedefler ve YAZIYI KALINLAŞTIRIR. */
#rankingTable table tr.rank_player td {
    background: transparent; /* Satır arka planını şeffaf yapar, ana arka plan görünür */
    border-bottom: 1px dashed #c8bca9; /* Satırlar arasına ince, kesik çizgi */
    padding: 4px;
    font-weight: bold; /* YAZILARI KALINLAŞTIRMAK İÇİN */
}

/* SADECE ana sıralama sayfası içindeki linkleri hedefler. */
#rankingTable a {
    color: #4a2c11;
    font-weight: bold;
}
#rankingTable a:hover {
    color: #a85204;
    text-decoration: underline;
}

/* =============================================================================
   BANLİST SAYFASI İÇİN NİHAİ GÖRSEL DÜZELTME (SIFIRLAMA)
============================================================================= */

/* 1. banlist.php'deki ana içerik kutusunun arka planını kaldırır */
.banlist-sayfasi .middle_center {
    background: none !important;
}

/* 2. banlist.php'deki 'Banlı oyuncu bulunamadı' mesajının stilini ayarlar */
.banlist-sayfasi .hata-mesaji {
    text-align: center;
    font-weight: bold;
    font-size: 14px;
    color: #4a2c11;
    padding: 20px;
}

/* 3. banlist.php'deki tabloyu, siralama.php'deki gibi yapar */
.banlist-sayfasi #rankingTable table {
    background: #e9e5d9; /* Açık krem arka plan */
    border: 1px solid #4a2c11;
    color: #422100;
    width: 100%;
}
.banlist-sayfasi #rankingTable .rank_head td {
    background-color: #d1c8b3;
    color: #4a2c11;
    font-weight: bold;
    border-bottom: 1px solid #4a2c11;
    padding: 5px;
}
.banlist-sayfasi #rankingTable .rank_player td {
    border-bottom: 1px dashed #c8bca9;
    padding: 4px;
    font-weight: bold;
    color: #422100;
}

#page {
    min-height: calc(100% - 291px) !important;
}
.wrapper {
    height: 100% !important;
}

/* =============================================================================
   SAĞ MENÜ - LOGIN PANEL (TEK KAYNAK / TEMİZ)  v6 AYARLI
============================================================================= */

/* Sağ menü kutusunu çok az içeri alır; sağ/sol taşma hissini azaltır */
#sb-right .br{
  padding-left: 2px;
  padding-right: 2px;
  box-sizing: border-box;
}

/* Login panel arka planı (PNG) */
#sb-right .login-panel{
  width: 209px;  /* Panelin tıklanabilir/kapsayıcı genişliği */
  height: 209px; /* Panelin kapsayıcı yüksekliği */
  background: url('/images/bl_login_panel_v6.png') no-repeat center top; /* v6 görselini ortalı basar */
  position: relative; /* top/left ile konum verebilmek için */
  margin: 0 auto;     /* paneli sağ menü içinde ortalar */

  top: 15px; /* ✅ PANELİ AŞAĞI İNDİRİR: değeri arttırdıkça aşağı iner (örn: 6-18px) */

  /* sağ/sol 2px daraltma hissi + kolona sığdırma */
  transform: scaleX(0.96);         /* ✅ YATAYDA hafif daraltır (0.96 ≈ %4) */
  transform-origin: top center;    /* daraltmayı üst-orta referans alarak yapar */
}

/* Formu panelin içine yerleştirir (ID/Şifre/Server + butonlar bu kapsayıcıda) */
#sb-right .login-panel form{
  position: absolute; /* panel içinde kesin konumlandırma */
  top: 53px;          /* ✅ içerikleri aşağı/ yukarı oynatır (inputların başladığı yer) */
  left: 0;            /* başlangıçta soldan 0 */
  right: 0;           /* sağdan 0 -> ortalama davranışı */
  width: 120px;       /* form kutusu genişliği (inputlar 150px olduğu için taşma normal) */
  margin: 0 auto;     /* formu ortalar */

  /* ✅ ID/ŞİFRE/SERVER GRUBUNU SOLA KAYDIRMAK İÇİN: */
  transform: translateX(-31px);  /* sola kaydırır. -4 / -6 / -8 deneyebilirsin */
}

/* Input + select hizası (kutuların genişliği ve aralıkları) */
#sb-right .login-panel .login-fields input.dat,
#sb-right .login-panel .login-fields select.dattiridit{
  display: block;                  /* her biri alt satıra geçsin */
  width: 180px;                    /* input/select genişliği */
  margin: 0 auto 6px auto; /* ortalama + alt boşluk */
  box-sizing: border-box;          /* padding/border width hesabına dahil */
}

/* Butonlar: 1. satır 2 kolon (Giriş / Kayıt), 2. satır tek (Şifremi Unuttum) */
#sb-right .login-panel .login-actions{
  display: grid !important;              /* grid düzeni */
  grid-template-columns: 78px 78px;      /* iki butonluk kolonlar */
  justify-content: center;               /* grid’i yatayda ortalar */
  column-gap: 10px;                      /* kolon arası boşluk */
  row-gap: 8px;                          /* satır arası boşluk */

  transform: translateX(25px);  /* sola kaydırır. -4 / -6 / -8 deneyebilirsin */

  /* ✅ Buton grubunu da komple sola kaydırmak istersen:
     transform: translateX(-6px);
  */
}

/* Panel içinde eski float davranışlarını kapatır (grid bozulmasın diye) */
#sb-right .login-panel .login-actions .login,
#sb-right .login-panel .login-actions a.reg,
#sb-right .login-panel .login-actions a.regs{
  float: none !important;
  margin: 0 !important;
}

/* Giriş butonu ölçüleri + özel imleç */
#sb-right .login-panel .login-actions .login{
  width: 78px !important;
  height: 22px !important;
  cursor: url('/scripts/mu.cur'), auto !important;
}

/* Kayıt ol butonu ölçüleri */
#sb-right .login-panel .login-actions a.reg{
  width: 78px !important;
  height: 22px !important;
}

/* Şifremi Unuttum: tek satırda ortalı */
#sb-right .login-panel .login-actions a.regs{
  grid-column: 1 / span 2; /* iki kolonu kaplasın */
  width: 160px !important;
  height: 22px !important;
  justify-self: center;    /* kendi satırında ortalı dursun */
}
