/* ============================================================
   sakarya.city — Tema düzeltmeleri
   Oluşturuldu: 2026-09-05

   NEDEN AYRI DOSYA:
   - style.css derlenmiş bir build çıktısıdır; tema yeniden derlenirse
     içine yazılanlar kaybolur.
   - style.integration.css Botble'ın panelden girilen "Özel CSS"inden
     ÜRETİLİR; panel kaydedilince üzerine yazılır. Ayrıca sürümü
     filectime() ile üretildiğinden Windows'ta içerik değişse bile
     tarayıcı önbelleği tazelenmez.
   Bu dosya tema config.php içinde kaydedilir, style.css'ten SONRA
   yüklenir ve sürümü dosyanın değiştirilme zamanına bağlıdır.
   ============================================================ */

/* ------------------------------------------------------------
   Hero başlığındaki dönen yazı (Doğru Yatırım / Güçlü Portföy / ...)

   SORUN 1 — Kırpılma: Animasyon script'i .cd-words-wrapper genişliğini
   JS ile sabitliyor. Ölçüm web fontu yüklenmeden yapıldığında 129px'te
   kalıyor, oysa görünür kelime ~354px. Temanın overflow:hidden kuralı
   yüzünden kelime kırpılıyordu.
   SORUN 2 — Konum: Sarmalayıcı inline-block olduğu için yazı başlığın
   son satırının yanına yapışıyordu; kendi satırında olması gerekiyor.

   ÇÖZÜM: Sarmalayıcı blok seviyesine alınır (kendi satırı) ve genişliği
   JS ölçümünden bağımsız hale getirilir. Kelimelerin position/opacity
   kurallarına DOKUNULMAZ — gizleme opacity ile, kayma animasyonunun
   kırpılması da temanın overflow:hidden kuralıyla yapılıyor; bunlar
   bozulursa kelimeler üst üste biner.
   ------------------------------------------------------------ */
h1.animationtext .cd-words-wrapper,
.flat-slider h1 .cd-words-wrapper {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 1.2em;
    text-align: center;
}

/* Mutlak konumlu kelimeler varsayılan olarak left:0 ile sola yaslanıyor;
   tam genişliğe yayıp ortalıyoruz. position/opacity'ye dokunulmuyor. */
h1.animationtext .cd-words-wrapper .item-text,
.flat-slider h1 .cd-words-wrapper .item-text {
    left: 0;
    right: 0;
    text-align: center;
}

/* ÜST ÜSTE BİNME DÜZELTMESİ (mobil): Rotasyon script'i is-visible/iş-hidden
   sınıflarını değiştirirken slide-out animasyonu "animation-fill-mode"
   olmadan bittiği an opacity son halini koruyamıyor; geçişin kısa bir
   anında ESKİ ve YENİ kelime aynı anda görünür kalıyor (iki satır üst
   üste). Çözüm:
     1) .slide-out animasyonu son halini (opacity:0) KORUSUN  = fill-mode both
     2) Gizli kelimeler yine de asla yazdırılmasın            = visibility:hidden
   visibility, opacity'ten bağımsız olduğundan, animasyon durdurulsa/
   keyframe çalışmasa bile gizli kelime asla görünmez. */
.animationtext.slide .item-text.is-hidden {
    visibility: hidden !important;
}
.animationtext.slide .item-text.is-visible {
    visibility: visible !important;
    animation-fill-mode: both;
}
.animationtext.slide .item-text.is-hidden {
    animation-fill-mode: both;
}


/* ============================================================
   AŞAĞIDAKİLER 2026-09-05'te PANELDEN (Görünüm > Özel CSS) TAŞINDI.

   Panele girilen CSS, style.integration.css dosyasına ÜRETİLİR ve
   veritabanında saklanır; yani güncelleme paketiyle sunucuya gitmez ve
   panel her kaydedildiğinde yeniden yazılır. Bu kuralların bir kısmı
   hâlâ aktif olarak kullanıldığı için (SATILDI damgası item-grid /
   item-list / ilan detay başlığında, danışman kartı görselleri, yükleme
   sırasında zıplamayı önleyen min-height kuralları) silinmedi, buraya
   taşındı. Panel alanı temizlendi.
   ============================================================ */
/* ==========================================================================
   SOLD (SATILDI) DURUMU İÇİN ÖZEL STİLLER - ARCHITECT KANKA
   ========================================================================== */

/* 1. PORTFÖY LİSTESİ: Resim Üzerine Çapraz Damga */
.property-sold-overlay {
    position: relative;
    overflow: hidden;
}

.property-sold-overlay::before {
    content: "SATILDI";
    position: absolute;
    top: 20px;
    right: -35px;
    background-color: #d9534f;
    color: white;
    font-weight: bold;
    font-size: 14px;
    padding: 10px 40px;
    transform: rotate(45deg);
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    letter-spacing: 1px;
    font-family: sans-serif;
}

.property-sold-overlay img {
    filter: grayscale(30%) blur(1px);
    opacity: 0.8;
}

/* 2. İLAN İÇERİĞİ: Başlık ve Fiyat Üzerini Çizme */
.property-sold-title,
.property-sold-price {
    text-decoration: line-through red 2px !important;
    color: #888 !important;
    position: relative;
}

.property-sold-price::after {
    content: " (İlan Aktif Değildir)";
    font-size: 12px;
    color: red;
    text-decoration: none !important;
    display: inline-block;
    margin-left: 10px;
    font-weight: normal;
}

/* ========================================================================== 
   KARŞILAMA MESAJI (YORUM KAPATILDI) 
   ========================================================================== */

/* --- DANIŞMAN PROFİL RESİMLERİNİ EŞİTLEME --- */

.agent-item .image img, 
.box-agent .image img, 
.tf-agent .image img,
.agent-card .image img {
    width: 100% !important;
    height: 320px !important;
    object-fit: cover !important;
    object-position: center top !important;
}

.agent-item .image .avatar, 
.box-agent .image .avatar,
.tf-agent .image .avatar,
.agent-card .image .avatar,
.agent-item .image > span,
.box-agent .image > span {
    width: 100% !important;
    height: 320px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0 !important;
}

/* İlan sekmeleri geç yüklenirken sayfanın zıplamasını engeller */
.flat-tab-recommended .tab-content,
.flat-property .tab-content {
    min-height: 500px;
}

/* Ana sayfa üst kapak (slider/hero) yüklenirken kaymayı önler */
.home-slider-container, 
.flat-slider {
    min-height: 500px; 
}

/* ============================================================
   PAGESPEED 2026-09-09 — CLS / BP / A11Y DÜZELTMELERİ
   ============================================================ */

/* ------------------------------------------------------------
   CLS: Swiper yüklenmeden ÖNCE (henüz JS çalışmadan) .swiper-slide
   elemanları doğal genişlikte yan yana dizilir ve görünüm alanının
   sağına taşar. Bu geçici yatay taşma, kaydırma çubuğu belirip
   görünüm alanı daralınca tüm sayfayı (html/body) kaydırıyordu
   (body CLS ≈ 1.0). overflow-x:clip ile geçici taşma görünmez yapılır;
   tarayıcı yatay kaydırma çubuğu üretmez, içerik kaymaz.
   (clip: hidden'dan farklı olarak yeni kaydırma konteyneri oluşturmaz,
   bu yüzden position:sticky/fixed sorunlara yol açmaz.)
   ------------------------------------------------------------ */
html, body {
    overflow-x: clip;
}

/* ------------------------------------------------------------
   BP image-aspect-ratio: Header logosu. HTML width=296 height=44
   attribute'ları doğru oranı veriyor (296/44 = 6.73 = 639/95),
   ama bir kural imajı height:40px'e zorlayıp 7.40'a bozuyordu.
   height:auto ile doğal oranın korunmasını garanti ediyoruz.
   ------------------------------------------------------------ */
.main-header .logo-box .logo img {
    height: auto !important;
    max-height: 44px;
    width: auto;
}

/* Footer logosu için aynı garanti */
.footer-top .footer-logo img,
.content-footer-top .footer-logo img,
.site-footer .footer-logo img {
    height: auto !important;
    width: auto !important;
    max-width: 100%;
    max-height: 44px;
}

/* ------------------------------------------------------------
   CLS: Sağ üst menü (Favorilerim / TRY / Giriş Yap) geç yerleşip
   top-header-right'ı itiyordu. Yatay düzene bölmeden sabit bir
   min-height veriyoruz; tek elemanın kayması tablo olarak ölçülen
   kaymayı tetiklese bile blok baştan rezerve ediliyor.
   ------------------------------------------------------------ */
.top-header-right {
    min-height: 30px;
}

/* ------------------------------------------------------------
   CLS: Arama formu (hero içindeki flat-tab-form) fontlar yüklenip
   geç reflow olunca tab-content'i ve dolayısıyla slider'ı itiyordu.
   display=optional ile font-swap kayması önlendi; ek olarak arama
   formunun yüksekliğini ilk render'da rezerve ediyoruz.
   ------------------------------------------------------------ */
.flat-slider .flat-tab-form .tab-content {
    min-height: 460px;
}

@media (max-width: 575.98px) {
    .flat-slider .flat-tab-form .tab-content {
        min-height: 520px;
    }
}

/* ------------------------------------------------------------
   CLS: Slider başlığı (h1.animationtext) font değişince satır
   yüksekliği değişip alt bloğu itiyordu. .cd-words-wrapper için
   zaten min-height var; h1'in kendisine de rezervasyon ekliyoruz.
   ------------------------------------------------------------ */
.flat-slider.home-1 h1.animationtext,
.home-slider-container h1.animationtext {
    min-height: 3em;
}

/* ============================================================
   MOBİL DOKUNMA HEDEFLERİ — 2026-09-05

   Google'ın mobil kullanılabilirlik denetimi, dokunulabilir öğelerin en az
   ~24x24 px olmasını ve komşularıyla arasında boşluk bırakmasını ister.
   Ölçümde 24 öğe bu eşiğin altındaydı:
     - 9 adet swiper sayfalama noktası (8x8 px)
     - 11 adet kart içi konum/kategori bağlantısı (yüksekliği 24 px'in altında)
   Görünümü değiştirmeden yalnızca DOKUNMA ALANINI büyütüyoruz: noktalar
   görsel olarak aynı boyutta kalır, çevresine şeffaf tıklama payı eklenir.
   ============================================================ */

@media (max-width: 991.98px) {
    /* Swiper noktaları: görsel boyut aynı, tıklama alanı 24x24'e çıkar. */
    .swiper-pagination-bullet {
        position: relative;
    }

    .swiper-pagination-bullet::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 24px;
        height: 24px;
        transform: translate(-50%, -50%);
        /* Görünmez tıklama payı */
        background: transparent;
    }

    /* Noktalar birbirine değmesin diye aralarında pay bırakılır. */
    .swiper-pagination-bullet + .swiper-pagination-bullet {
        margin-left: 8px !important;
    }

    /* Kart içi küçük bağlantılar (konum, kategori vb.) için asgari yükseklik. */
    a.caption-1,
    a.text-variant-2,
    .box-house .location a,
    .homeya-box .location a {
        display: inline-block;
        min-height: 24px;
        line-height: 24px;
    }
}