/*
 * GameBuffed — özel stiller
 * Tema: dark-grid
 * Yükleme yeri: content/themes/dark-grid/style/custom.css
 *
 * Bu dosya tema tarafından EN SON yüklenir ve CloudArcade güncelleyicisi
 * tarafından ÜZERİNE YAZILMAZ. Tüm özelleştirmeler buraya yazılmalı,
 * style.css'e asla dokunulmamalı.
 */

/* ============================================================
   1. LOGO VE HEADER
   Sorun: Temada logo için hiçbir boyut sınırı yok
   (style.css'te sadece ".site-logo { padding: 5px }" var).
   Yüklü logo 807x176 px; sınır olmadığı için 817x186 px basılıyor,
   navbar'a sığmıyor ve header 236 px'e şişip 3 satıra bölünüyor.
   Ölçüm (1728 px): header 236 -> 68 px, logo 817x186 -> 202x44.
   ============================================================ */
.site-logo {
  height: 44px;
  width: auto;
  padding: 0;
}

.navbar-brand {
  margin-right: 1rem;
  padding: 0;
}

#mainNav {
  padding: 12px 0;
}

/* ------------------------------------------------------------
   1b. NAVBAR TAŞMASI
   Sorun: .navbar "flex-wrap: wrap" + "justify-content: space-between"
   ile geliyor ve hiç esneme payı yok. Menü uzayınca (Blog eklendi)
   giriş yapmış kullanıcının profil avatarı alt satıra düşüyordu;
   açılır menü .container'a göre "right:0" konumlandığı için de
   avatardan kopuk görünüyordu.

   Çözüm: satır sarmayı kapat, esneyebilen öğelere küçülme izni ver.
   ------------------------------------------------------------ */
#mainNav .container {
  flex-wrap: nowrap;
}

#mainNav .navbar-brand {
  flex: 0 0 auto;
}

#mainNav .navbar-collapse,
#mainNav .navbar-nav {
  min-width: 0;
  flex-wrap: nowrap;
}

#mainNav .navbar-nav .nav-link {
  padding-left: 7px;
  padding-right: 7px;
}

#mainNav .user-avatar {
  flex: 0 0 auto;
  margin-left: 10px;
}

/* Bootstrap 5'te .form-inline artık flex değil; dar alanda arama
   kutusu ile butonu alt alta düşüyordu. */
#mainNav .form-inline {
  display: flex;
  flex-wrap: nowrap;
  min-width: 0;
  flex: 0 1 auto;
}

#mainNav .form-inline input {
  min-width: 0;
  width: auto;
  flex: 1 1 100px;
}

#mainNav .form-inline button {
  flex: 0 0 auto;
}

/* ------------------------------------------------------------
   1c. 992–1199 px ARALIĞI  (yukarıdaki nowrap'in yan etkisi)
   Navbar 992 px'in altında hamburger'a düşüyor, üstünde ise tüm
   menü tek satırda duruyor. Tam bu aradaki dar bantta 9 menü
   linki + arama + avatar sığmıyordu: satır sarma kapalı olduğu
   için sayfa yana taşıyordu (1010 px'te 22 px taşma, arama kutusu
   0 px'e eziliyordu). Link boşluklarını bu bantta daraltmak
   taşmayı sıfırlıyor.
   Ölçüm: 1000 / 1010 / 1120 / 1210 / 1400 px -> taşma 0.
   ------------------------------------------------------------ */
@media (min-width: 992px) and (max-width: 1199px) {
  #mainNav .navbar-nav .nav-link {
    padding-left: 3px;
    padding-right: 3px;
    font-size: .9rem;
  }
}

/* ============================================================
   2. KATEGORİ ÇUBUĞU
   ============================================================ */
.nav-categories {
  border-top: 1px solid rgba(255, 255, 255, .05);
  border-bottom: 1px solid rgba(255, 255, 255, .05);
}

nav.greedy .links > a > li {
  transition: color .15s ease;
}

/* Açılır "MORE" listesi tema genelinde beyaz kalıyor, koyu temaya uyduruyoruz */
ul.hidden-links {
  background: #1a1640;
  background-color: #1a1640;
  border: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
}

ul.hidden-links a {
  color: #cbdbe3;
}

ul.hidden-links li:hover {
  background-color: #29254f;
}

/* ============================================================
   3. OYUN KARTLARI
   Hover'da yükselme + gölge: kartın tıklanabilir olduğunu belli eder
   ============================================================ */
.grid-item .list-game,
.item-grid .list-game {
  border-radius: 12px;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
}

.grid-item:hover .list-game,
.item-grid:hover .list-game {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .55);
}

.grid-item .list-thumbnail img,
.item-grid .list-thumbnail img {
  display: block;
  border-radius: 12px;
}

/* ============================================================
   4. BÖLÜM BAŞLIKLARI
   ============================================================ */
h3.item-title {
  letter-spacing: .04em;
}

/* ============================================================
   5. MOBİL DÜZELTMELER
   ============================================================ */
@media (max-width: 991px) {
  .site-logo {
    height: 36px;
  }

  #mainNav {
    padding: 8px 0;
  }
}
