/*
 Theme Name:   Construction Light Child
 Theme URI:    http://example.com/
 Description:  Construction Light Child Theme
 Author:       Senin Adın
 Author URI:   http://example.com/
 Template:     construction-light
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         responsive, blog, e-commerce
 Text Domain:  construction-light-child
*/

/* Ana temanın stil dosyasını içe aktar - BU SATIR EN ÜSTTE OLMALI VE TEK OLMALI */
@import url("../construction-light/style.css");

/* Buraya kendi özel CSS kodlarımızı ekleyeceğiz - TÜM EKLEDİĞİMİZ KURALLAR AŞAĞIDA */

/* Telegram İkonunu Menü Altında Ortalamak İçin */
/* Not: header-two.php dosyasında ikonun nav-classic-wrap div'inin hemen altında olduğundan emin olmalısın */
.telegram-icon-center {
    /* Yatayda ortalama için */
    width: 60px; /* ***** Div'in genişliğini belirle - İkon boyutuyla aynı veya biraz büyük olabilir ***** */
    margin: 10px auto; /* ***** Üstten/alttan biraz boşluk ve yatayda ortalama ***** */

    /* Eski pozisyonlama kuralları kaldırıldı */
    /* position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; */

    /* Geçici kırmızı kenarlık kaldırıldı */
    /* border: 3px solid red !important; box-sizing: border-box; */
}

.telegram-icon-center a img {
    display: block; /* Resmin hizalanması için */
    max-width: 100%; /* Konteyner dışına taşmasını engelle */
    height: auto; /* Oranı koru */
}

/* Telegram görselinin (<img>) boyutunu ayarlama */
.telegram-icon-center img {
     width: 60px; /* İkon genişliği */
     height: auto; /* Yüksekliği otomatik ayarla */
}

/* Dikkat mesajı görseli kapsayıcısının altındaki boşluğu azaltma */
/* Not: Bu görsel header-two.php'de dikkat-gorseli-kapsayici div'i içinde olmalı */
.dikkat-gorseli-kapsayici {
    margin-bottom: 5px; /* ***** Görselden sonraki boşluğu ayarla - Bu değeri değiştirebilirsin ***** */
    /* header-two.php'deki inline style'a ek olarak veya onun yerine kullanılabilir */
    padding: 0 !important; /* Gerekirse iç boşluğu kaldır */
}


/* *** BURADAN AŞAĞISI SENİN DAHA ÖNCE EKLEDİĞİN DİĞER ÖZEL KURALLAR *** */
/* Daha önceki dosyalardan alınan üye listesi/grid stilleri */
.vip-esc-members-grid {
    display: flex;
    flex-wrap: wrap; /* Bir satır dolunca öğeler alt satıra geçer */
    justify-content: center; /* Flexbox öğelerini yatayda ortala */
     text-align: center; /* Metni ortala, flexbox öğeleri için justify-content yeterli olabilir */
}

.vip-esc-members-grid .uye-item {
    flex: 0 1 280px; /* Her üye öğesi için minimum genişlik belirle */
    margin: 10px; /* Marjinler ile öğeler arasında boşluk yarat */
}

.vip-esc-members-grid .uye-item .uye-photos-container .uye-photo.default {
    object-fit: contain; /* Varsayılan görselin oranı bozulmasın */
    background-color: #eee; /* Arka plan rengi */
}

.vip-esc-members-grid .uye-item .uye-info-overlay {
    position: absolute; /* Fotoğraf konteynerine göre konumlanacak */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Tüm fotoğraf alanını kapla */
    z-index: 2; /* Fotoğrafın üstünde görünmesi için */
    padding: 15px; /* İç boşluk */
    color: #fff; /* Yazı rengi */
    text-shadow: 1px 1px 3px rgba(0,0,0,0.5); /* Yazı okunurluğu için gölge */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    pointer-events: none; /* Önemli: Bu div'in kendisi fare olaylarına yanıt vermesin */
    box-sizing: border-box;
}

.vip-esc-members-grid .uye-item .uye-info-overlay .top-section {
    pointer-events: auto; /* Üst kısımdaki linkler için */
}

.vip-esc-members-grid .uye-item .uye-info-overlay .bottom-section {
     pointer-events: auto; /* Alt kısımdaki ikon linkleri için */
     margin-top: auto;
}

.vip-esc-members-grid .uye-item .uye-info-overlay a.contact-icon {
    color: #fff; /* İkon linklerinin rengi */
    margin-right: 10px; /* İkonlar arasına boşluk */
    text-decoration: none;
    font-size: 1.5em;
    pointer-events: auto;
}

.vip-esc-members-grid .uye-item .uye-preferences ul {
    list-style: none;
    padding: 0;
    margin: 5px 0 0 0;
}

.vip-esc-members-grid .uye-item .uye-preferences li {
    margin-bottom: 3px;
    font-size: 0.9em;
}

/* Ana menüyü yatayda ortalama */
.nav-classic-wrap .nav-wrap {
    text-align: center; /* İçindeki satır içi veya satır içi blok elementleri ortalar */
}

/* İsteğe bağlı: Eğer menü öğeleri arasında boşluk gerekirse */
.main-menu li {
    display: inline-block; /* Menü öğelerinin yan yana durmasını sağlar ve boşluk ayarı için gerekli */
    margin: 0 10px; /* Üst/alt 0, sağ/sol 10px boşluk ekler - Değeri ayarlayabilirsin */
}

/* Masaüstünde ana içeriğin daha geniş görünmesi için */
@media (min-width: 992px) { /* 992px ve daha geniş ekranlar için geçerli */
    .container {
        max-width: 100%; /* Kapsayıcının maksimum genişliğini %100 yap */
        padding-left: 15px; /* Soldan biraz iç boşluk */
        padding-right: 15px; /* Sağdan biraz iç boşluk */
    }

    /* Eğer temada .row'lar negatif marjin kullanıyorsa */
    .container .row {
        margin-left: -15px;
        margin-right: -15px;
    }
}

/* İsteğe bağlı: Eğer 992px yeterli gelmezse, daha geniş ekranlar için */
@media (min-width: 1200px) { /* 1200px ve daha geniş ekranlar için geçerli */
     .container {
        max-width: 100%; /* Veya istersen daha yüksek bir piksel değeri verebilirsin, mesela 1400px */
     }
}

/* Arama kısmını tamamen gizleme (header içindeki) */
.header-search {
    display: none !important; /* Öğeyi sayfada gösterme */
	 visibility: hidden !important;
}
/* Belirtilen özel arama formu/widget seçicisini gizleme (eğer uygulanıyorsa) */
.menu-search-form.widget_search {
    display: none !important; /* Öğeyi kesinlikle gizle */
	visibility: hidden !important;
}


/* Sayfanın altına inen arama ekranı/overlayini tamamen gizleme (footer.php'den gelen) */
.conslight-search-wrapper {
    display: none !important;     /* Öğeyi sayfada kesinlikle gizle */
    visibility: hidden !important; /* Öğenin görünürlüğünü de kapat */
}

/* Sayfanın altına inen geri yukarı git butonunu gizleme */
#back-to-top {
    display: none !important; /* Öğeyi sayfada kesinlikle gizle */
    visibility: hidden !important; /* Öğenin görünürlüğünü de kapat */
}


/* Eğer daha önce eklediğin ve yukarıdaki listede olmayan başka özel CSS kuralların varsa, onları da bu kısmın altına ekleyebilirsin */